| 1 | /* |
|---|
| 2 | * Ext JS Library 2.2.1 |
|---|
| 3 | * Copyright(c) 2006-2009, Ext JS, LLC. |
|---|
| 4 | * licensing@extjs.com |
|---|
| 5 | * |
|---|
| 6 | * http://extjs.com/license |
|---|
| 7 | */ |
|---|
| 8 | |
|---|
| 9 | /*=================================== |
|---|
| 10 | /* Basic page styles |
|---|
| 11 | /*===================================*/ |
|---|
| 12 | body { |
|---|
| 13 | font-family:'lucida grande',tahoma,arial,sans-serif; |
|---|
| 14 | font-size:11px; |
|---|
| 15 | } |
|---|
| 16 | a { |
|---|
| 17 | color:#15428B; |
|---|
| 18 | } |
|---|
| 19 | a:link, a:visited { |
|---|
| 20 | text-decoration: none; |
|---|
| 21 | } |
|---|
| 22 | a:hover { |
|---|
| 23 | text-decoration: underline; |
|---|
| 24 | } |
|---|
| 25 | #header { |
|---|
| 26 | background: #7F99BE url(images/layout-browser-hd-bg.gif) repeat-x center; |
|---|
| 27 | } |
|---|
| 28 | #header h1 { |
|---|
| 29 | font-size: 16px; |
|---|
| 30 | color: #fff; |
|---|
| 31 | font-weight: normal; |
|---|
| 32 | padding: 5px 10px; |
|---|
| 33 | } |
|---|
| 34 | #start-div h2 { |
|---|
| 35 | font-size: 12px; |
|---|
| 36 | color: #555; |
|---|
| 37 | padding-bottom:5px; |
|---|
| 38 | border-bottom:1px solid #C3D0DF; |
|---|
| 39 | } |
|---|
| 40 | #start-div p { |
|---|
| 41 | margin: 10px 0; |
|---|
| 42 | } |
|---|
| 43 | #details-panel h2 { |
|---|
| 44 | padding:10px 10px 0; |
|---|
| 45 | font-size:12px; |
|---|
| 46 | color:#15428B; |
|---|
| 47 | } |
|---|
| 48 | #details-panel p { |
|---|
| 49 | padding:10px 10px 0; |
|---|
| 50 | } |
|---|
| 51 | #details-panel pre { |
|---|
| 52 | border-top:1px dotted #ddd; |
|---|
| 53 | border-bottom:1px dotted #ddd; |
|---|
| 54 | margin-top:10px; |
|---|
| 55 | padding:0 5px; |
|---|
| 56 | background:#f5f5f5; |
|---|
| 57 | } |
|---|
| 58 | #details-panel .details-info { |
|---|
| 59 | margin:15px; |
|---|
| 60 | padding:15px; |
|---|
| 61 | border:1px dotted #999; |
|---|
| 62 | color:#555; |
|---|
| 63 | background: #f9f9f9; |
|---|
| 64 | } |
|---|
| 65 | |
|---|
| 66 | /*=================================== |
|---|
| 67 | /* Customized layout styles |
|---|
| 68 | /*===================================*/ |
|---|
| 69 | |
|---|
| 70 | /* Remove the border around the tabs and override the default white background: */ |
|---|
| 71 | .x-tab-panel-header-plain .x-tab-strip-top { |
|---|
| 72 | background: #DFE8F6 url(../images/default/tabs/tab-strip-bg.gif) repeat-x scroll center bottom !important; |
|---|
| 73 | } |
|---|
| 74 | |
|---|
| 75 | /* Custom CSS applied to a single panel in an accordion: */ |
|---|
| 76 | .custom-accordion .x-panel-body { |
|---|
| 77 | font-family:georgia,serif; |
|---|
| 78 | padding:20px 80px !important; |
|---|
| 79 | background:#ffe; |
|---|
| 80 | font-size:18px; |
|---|
| 81 | text-align:center; |
|---|
| 82 | color:#15428B; |
|---|
| 83 | } |
|---|
| 84 | .custom-accordion .x-panel-header-text { |
|---|
| 85 | font-weight:bold; |
|---|
| 86 | font-style:italic; |
|---|
| 87 | color:#555; |
|---|
| 88 | } |
|---|
| 89 | |
|---|
| 90 | /* Custom style for the FormLayout footer so that it integrates into the border layout nicely: */ |
|---|
| 91 | #form-panel .x-panel-footer { |
|---|
| 92 | background:#DFE8F6; |
|---|
| 93 | border-color:#99BBE8; |
|---|
| 94 | border-style:none solid solid; |
|---|
| 95 | border-width:0pt 1px 1px; |
|---|
| 96 | } |
|---|
| 97 | |
|---|
| 98 | /* Customize the TableLayout html using standard CSS rules: */ |
|---|
| 99 | #table-panel .x-table-layout { |
|---|
| 100 | padding:5px; |
|---|
| 101 | } |
|---|
| 102 | #table-panel .x-table-layout td { |
|---|
| 103 | vertical-align:top; |
|---|
| 104 | padding:5px; |
|---|
| 105 | font-size: 11px; |
|---|
| 106 | } |
|---|
| 107 | |
|---|
| 108 | /* Toolbar icons for absolute form example: */ |
|---|
| 109 | .icon-send { |
|---|
| 110 | background-image:url(images/email_go.png) !important; |
|---|
| 111 | } |
|---|
| 112 | .icon-save { |
|---|
| 113 | background-image:url(images/disk.png) !important; |
|---|
| 114 | } |
|---|
| 115 | .icon-print { |
|---|
| 116 | background-image:url(images/printer.png) !important; |
|---|
| 117 | } |
|---|
| 118 | .icon-spell { |
|---|
| 119 | background-image:url(images/spellcheck.png) !important; |
|---|
| 120 | } |
|---|
| 121 | .icon-attach { |
|---|
| 122 | background-image:url(images/page_attach.png) !important; |
|---|
| 123 | } |
|---|
| 124 | /* Custom rule to make the toolbar fit within a framed panel with no margin: */ |
|---|
| 125 | .email-form .x-panel-mc .x-panel-tbar .x-toolbar { |
|---|
| 126 | border-top:1px solid #C2D6EF; |
|---|
| 127 | border-left:1px solid #C2D6EF; |
|---|
| 128 | border-bottom:1px solid #99BBE8; |
|---|
| 129 | margin:-5px -4px 0; |
|---|
| 130 | } |
|---|
| 131 | |
|---|
| 132 | /* Custom styles for the "Tabs with nested layouts" example: */ |
|---|
| 133 | .inner-tab-custom .x-border-layout-ct { |
|---|
| 134 | background: #fff; |
|---|
| 135 | } |
|---|
| 136 | |
|---|
| 137 | /*=================================== |
|---|
| 138 | /* Rules for custom ux layouts |
|---|
| 139 | /*====================================*/ |
|---|
| 140 | /* |
|---|
| 141 | * Ext.ux.layout.CenterLayout |
|---|
| 142 | */ |
|---|
| 143 | .ux-layout-center-item { |
|---|
| 144 | margin:0 auto; |
|---|
| 145 | text-align:left; |
|---|
| 146 | } |
|---|
| 147 | .ux-layout-center .x-panel-body, /* if the container is a panel */ |
|---|
| 148 | body.ux-layout-center { /* if the container is the doc body (for viewport) */ |
|---|
| 149 | text-align:center; |
|---|
| 150 | } |
|---|
