resources/css/xtheme-slate.css

   1 /*\r
   2  * Ext JS Library 2.2.1\r
   3  * Copyright(c) 2006-2009, Ext JS, LLC.\r
   4  * licensing@extjs.com\r
   5  * \r
   6  * http://extjs.com/license\r
   7  */\r
   8 \r
   9 /*\r
  10  * Slate Theme\r
  11  * Originally created by JC Bize\r
  12  */\r
  13 \r
  14 /* Masks */\r
  15 .ext-el-mask{\r
  16         background-color:#c8cbd0;\r
  17 }\r
  18 .ext-el-mask-msg{\r
  19         border:1px solid #89a;\r
  20         background:#d8dbe0 url(../images/slate/box/tb-blue.gif) repeat-x 0 -16px;\r
  21 }\r
  22 .ext-el-mask-msg div{\r
  23         background:#eef0f2;\r
  24         border:1px solid #abc;\r
  25         color:#222;\r
  26 }\r
  27 .x-item-disabled *{\r
  28         color:#333 !important;\r
  29 }\r
  30 \r
  31 \r
  32 /* Tab Panels */\r
  33 \r
  34 .x-tab-panel-header, .x-tab-panel-footer{\r
  35         background:#6b869f;\r
  36         border-color:#4f657b;\r
  37 }\r
  38 .x-tab-panel-header{\r
  39         border-color:#abc;\r
  40 }\r
  41 .x-tab-panel-footer{\r
  42         border-color:#abc;\r
  43 }\r
  44 ul.x-tab-strip-top{\r
  45         background:#dbdbdb url(../images/slate/tabs/tab-strip-bg.gif) repeat-x left top;\r
  46         border-color:#4c647e;\r
  47     padding-top:2px;\r
  48 }\r
  49 ul.x-tab-strip-bottom{\r
  50         background-image:url(../images/slate/tabs/tab-strip-btm-bg.gif);\r
  51         border-color:#566c82;\r
  52 }\r
  53 .x-tab-strip span.x-tab-strip-text{\r
  54         color:#333;\r
  55 }\r
  56 .x-tab-strip-over span.x-tab-strip-text{\r
  57         color:#111;\r
  58 }\r
  59 .x-tab-strip-active span.x-tab-strip-text{\r
  60         color:#fff;\r
  61 }\r
  62 .x-tab-strip-disabled .x-tabs-text{\r
  63         color:#aaaaaa;\r
  64 }\r
  65 .x-tab-strip-top .x-tab-right{\r
  66         background-image:url(../images/slate/tabs/tabs-sprite.gif);\r
  67 }\r
  68 .x-tab-strip-top .x-tab-left{\r
  69         background-image:url(../images/slate/tabs/tabs-sprite.gif);\r
  70 }\r
  71 .x-tab-strip-top .x-tab-strip-inner{\r
  72         background-image:url(../images/slate/tabs/tabs-sprite.gif);\r
  73 }\r
  74 .x-tab-strip-bottom .x-tab-right{\r
  75         background-image:url(../images/slate/tabs/tab-btm-inactive-right-bg.gif);\r
  76 }\r
  77 .x-tab-strip-bottom .x-tab-left{\r
  78         background-image:url(../images/slate/tabs/tab-btm-inactive-left-bg.gif);\r
  79 }\r
  80 .x-tab-strip-bottom .x-tab-strip-active .x-tab-right{\r
  81         background-image:url(../images/slate/tabs/tab-btm-right-bg.gif);\r
  82 }\r
  83 .x-tab-strip-bottom .x-tab-strip-active .x-tab-left{\r
  84         background-image:url(../images/slate/tabs/tab-btm-left-bg.gif);\r
  85 }\r
  86 .x-tab-strip .x-tab-strip-closable a.x-tab-strip-close{\r
  87         background-image:url(../images/slate/tabs/tab-close.gif);\r
  88 }\r
  89 .x-tab-strip .x-tab-strip-closable a.x-tab-strip-close:hover{\r
  90         background-image:url(../images/slate/tabs/tab-close.gif);\r
  91 }\r
  92 .x-tab-panel-body{\r
  93     border-color:#abc;\r
  94     background:#fff;\r
  95 }\r
  96 .x-tab-panel-bbar .x-toolbar{\r
  97     border-color:#abc;\r
  98 }\r
  99 .x-tab-panel-tbar .x-toolbar{\r
 100     border-color:#abc;\r
 101 }\r
 102 .x-tab-panel-header-plain .x-tab-strip-spacer,\r
 103 .x-tab-panel-footer-plain .x-tab-strip-spacer{\r
 104     border-color:#abc;\r
 105         background:#6b869f;\r
 106 }\r
 107 .x-tab-scroller-left{\r
 108     background-image:url(../images/slate/tabs/scroll-left.gif);\r
 109     border-color:#aeaeae;\r
 110 }\r
 111 .x-tab-scroller-right{\r
 112     background-image:url(../images/slate/tabs/scroll-right.gif);\r
 113     border-color:#aeaeae;\r
 114 }\r
 115 \r
 116 \r
 117 /* Forms */\r
 118 \r
 119 .x-form-check{\r
 120         background:url('../images/slate/form/checkbox.gif') no-repeat 0 0;\r
 121 }\r
 122 .x-form-radio{\r
 123         background:url('../images/slate/form/radio.gif') no-repeat 0 0;\r
 124 }\r
 125 .x-form-check-group-label{\r
 126     border-bottom:1px solid #99bbe8;\r
 127     color:#15428b;\r
 128     margin-bottom:5px;\r
 129     padding-left:3px !important;\r
 130     float:none !important;\r
 131 }\r
 132 .x-form-text, textarea.x-form-field{\r
 133         border:1px solid #9ab; \r
 134 }\r
 135 .x-trigger-wrap-focus .x-form-trigger{\r
 136         border-bottom:1px solid #4a7192;\r
 137 }\r
 138 .x-form-focus,textarea.x-form-focus{\r
 139         border:1px solid #4a7192;\r
 140 }\r
 141 .x-form-field-wrap .x-form-trigger{\r
 142         background:transparent url(../images/slate/form/trigger.gif) no-repeat 0 0;\r
 143 }\r
 144 .x-form-field-wrap .x-form-date-trigger{\r
 145         background-image:url(../images/slate/form/date-trigger.gif);\r
 146 }\r
 147 .x-form-field-wrap .x-form-clear-trigger{\r
 148         background-image:url(../images/slate/form/clear-trigger.gif);\r
 149 }\r
 150 .x-form-field-wrap .x-form-search-trigger{\r
 151         background-image:url(../images/slate/form/search-trigger.gif);\r
 152 }\r
 153 .x-form-field-wrap .x-form-trigger{\r
 154         border-bottom:1px solid #778899;\r
 155 }\r
 156 .x-form-field-wrap .x-form-trigger-over{\r
 157         background-position:-17px 0;\r
 158 }\r
 159 .x-form-field-wrap .x-form-trigger-click{\r
 160         background-position:-34px 0;\r
 161 }\r
 162 .x-trigger-wrap-focus .x-form-trigger{\r
 163         background-position:-51px 0;\r
 164 }\r
 165 .x-trigger-wrap-focus .x-form-trigger-over{\r
 166         background-position:-68px 0;\r
 167 }\r
 168 .x-trigger-wrap-focus .x-form-trigger-click{\r
 169         background-position:-85px 0;\r
 170 }\r
 171 .x-form fieldset legend{\r
 172         color:#333;\r
 173 }\r
 174 \r
 175 \r
 176 /* Buttons */\r
 177 \r
 178 .x-btn button{\r
 179         color:#fff;\r
 180 }\r
 181 .x-btn-over button{\r
 182         color:#fff;\r
 183 }\r
 184 .x-btn-focus button{\r
 185         color:#fff8da;\r
 186 }\r
 187 .x-btn-left{\r
 188         background-image:url(../images/slate/button/btn-sprite.gif);\r
 189 }\r
 190 .x-btn-right{\r
 191         background-image:url(../images/slate/button/btn-sprite.gif);\r
 192 }\r
 193 .x-btn-center{\r
 194         background-image:url(../images/slate/button/btn-sprite.gif);\r
 195 }\r
 196 .x-btn-text-icon .x-btn-with-menu .x-btn-center em{\r
 197         background:transparent url(../images/slate/toolbar/btn-arrow.gif) no-repeat scroll right 3px;\r
 198 }\r
 199 .x-btn-with-menu .x-btn-center em{\r
 200         background:transparent url(../images/slate/toolbar/btn-arrow.gif) no-repeat scroll right 0pt;\r
 201 }\r
 202 .x-btn-menu-arrow-wrap .x-btn-center button{\r
 203         background:transparent url(../images/slate/button/btn-arrow.gif) no-repeat left 3px;\r
 204 }\r
 205 \r
 206 \r
 207 /* Toolbars */\r
 208 \r
 209 .x-toolbar{\r
 210         border-color:#abc;\r
 211     background:#f0f4f5 url(../images/slate/toolbar/bg.gif) repeat-x top left;\r
 212 }\r
 213 .x-toolbar button{\r
 214     color:#f4f4f4;\r
 215 }\r
 216 .x-toolbar .ytb-text{\r
 217         color:#f4f4f4;\r
 218 }\r
 219 .x-toolbar .x-btn-menu-arrow-wrap .x-btn-center button{\r
 220     background-image:url(../images/slate/toolbar/btn-arrow.gif);\r
 221 }\r
 222 .x-toolbar .x-btn-text-icon .x-btn-menu-arrow-wrap .x-btn-center button{\r
 223     background-image:url(../images/slate/toolbar/btn-arrow.gif);\r
 224 }\r
 225 .x-toolbar .x-btn-over .x-btn-left{\r
 226         background-image:url(../images/slate/toolbar/tb-btn-sprite.gif);\r
 227 }\r
 228 .x-toolbar .x-btn-over .x-btn-right{\r
 229         background-image:url(../images/slate/toolbar/tb-btn-sprite.gif);\r
 230 }\r
 231 .x-toolbar .x-btn-over .x-btn-center{\r
 232         background-image:url(../images/slate/toolbar/tb-btn-sprite.gif);\r
 233 }\r
 234 .x-toolbar .x-btn-over button{\r
 235     color:#fff;\r
 236 }\r
 237 .x-toolbar .x-btn-click .x-btn-left, .x-toolbar .x-btn-pressed .x-btn-left, .x-toolbar .x-btn-menu-active .x-btn-left{\r
 238         background-image:url(../images/slate/toolbar/tb-btn-sprite.gif);\r
 239 }\r
 240 .x-toolbar .x-btn-click .x-btn-right, .x-toolbar .x-btn-pressed .x-btn-right, .x-toolbar .x-btn-menu-active .x-btn-right{\r
 241         background-image:url(../images/slate/toolbar/tb-btn-sprite.gif);\r
 242 }\r
 243 .x-toolbar .x-btn-click .x-btn-center, .x-toolbar .x-btn-pressed .x-btn-center, .x-toolbar .x-btn-menu-active .x-btn-center{\r
 244         background-image:url(../images/slate/toolbar/tb-btn-sprite.gif);\r
 245 }\r
 246 .x-toolbar .ytb-sep{\r
 247         background-image:url(../images/slate/grid/grid-split.gif);\r
 248 }\r
 249 .x-statusbar .x-status-text-panel{\r
 250         border-color:#9ab #9ab #9ab #9ab;\r
 251 }\r
 252 .x-statusbar .x-status-text{\r
 253         color:#ddc;\r
 254 }\r
 255 \r
 256 \r
 257 /* Resizable Handles */\r
 258 \r
 259 .x-resizable-over .x-resizable-handle-east,.x-resizable-pinned .x-resizable-handle-east{\r
 260         background:url(../images/slate/sizer/e-handle.gif);background-position:left;\r
 261 }\r
 262 .x-resizable-over .x-resizable-handle-west,.x-resizable-pinned .x-resizable-handle-west{\r
 263         background:url(../images/slate/sizer/e-handle.gif);background-position:left;\r
 264 }\r
 265 .x-resizable-over .x-resizable-handle-south,.x-resizable-pinned .x-resizable-handle-south{\r
 266         background:url(../images/slate/sizer/s-handle.gif);background-position:top;\r
 267 }\r
 268 .x-resizable-over .x-resizable-handle-north,.x-resizable-pinned .x-resizable-handle-north{\r
 269         background:url(../images/slate/sizer/s-handle.gif);background-position:top;\r
 270 }\r
 271 .x-resizable-over .x-resizable-handle-southeast,.x-resizable-pinned .x-resizable-handle-southeast{\r
 272         background:url(../images/slate/sizer/se-handle.gif);background-position:top left;\r
 273 }\r
 274 .x-resizable-over .x-resizable-handle-northwest,.x-resizable-pinned .x-resizable-handle-northwest{\r
 275         background:url(../images/slate/sizer/nw-handle.gif);background-position:bottom right;\r
 276 }\r
 277 .x-resizable-over .x-resizable-handle-northeast,.x-resizable-pinned .x-resizable-handle-northeast{\r
 278         background:url(../images/slate/sizer/ne-handle.gif);background-position:bottom left;\r
 279 }\r
 280 .x-resizable-over .x-resizable-handle-southwest,.x-resizable-pinned .x-resizable-handle-southwest{\r
 281         background:url(../images/slate/sizer/sw-handle.gif);background-position:top right;\r
 282 }\r
 283 .x-resizable-proxy{\r
 284         border:1px dashed #748296;\r
 285 }\r
 286 \r
 287 \r
 288 /* Grids */\r
 289 \r
 290 .x-grid-panel .x-panel-mc .x-panel-body{\r
 291     border:1px solid #abc;\r
 292 }\r
 293 .x-grid3-row-selected{\r
 294         background:#fbf0d2 !important;\r
 295         border:1px dotted #ccc;\r
 296 }\r
 297 .x-grid3-hd-btn{\r
 298         background:#f7ecc1 url(../images/slate/grid/grid3-hd-btn.gif) no-repeat left center;\r
 299 }\r
 300 .x-grid3-header{\r
 301         background:#f9f9f9 url(../images/slate/grid/grid3-hrow.gif) repeat-x 0 bottom;\r
 302 }\r
 303 td.x-grid3-hd-over .x-grid3-hd-inner,td.sort-desc .x-grid3-hd-inner,td.sort-asc .x-grid3-hd-inner,td.x-grid3-hd-menu-open .x-grid3-hd-inner{\r
 304         background:#ebf3fd url(../images/slate/grid/grid3-hrow-over.gif) repeat-x left bottom;\r
 305 }\r
 306 .sort-asc .x-grid3-sort-icon{\r
 307         background-image:url(../images/slate/grid/sort_asc.gif);\r
 308 }\r
 309 .sort-desc .x-grid3-sort-icon{\r
 310         background-image:url(../images/slate/grid/sort_desc.gif);\r
 311 }\r
 312 td.x-grid3-hd-over, td.sort-desc, td.sort-asc, td.x-grid3-hd-menu-open{\r
 313         border-left:1px solid #fff;\r
 314         border-right:1px solid #ccc;\r
 315 }\r
 316 .x-grid3-check-col{\r
 317         background-image:url(../images/slate/menu/unchecked.gif);\r
 318 }\r
 319 .x-grid3-check-col-on{\r
 320         background-image:url(../images/slate/menu/checked.gif);\r
 321 }\r
 322 .x-grid3-cell-selected{\r
 323         background-color:#e0eaee!important;\r
 324 }\r
 325 .x-grid3-body .x-grid3-td-expander{\r
 326         background:transparent url(../images/slate/grid/grid3-special-col-bg.gif) repeat-y right;\r
 327 }\r
 328 .x-grid3-body .x-grid3-td-checker{\r
 329         background:transparent url(../images/slate/grid/grid3-special-col-bg.gif) repeat-y right;\r
 330 }\r
 331 .x-grid3-body .x-grid3-td-numberer{\r
 332         background:transparent url(../images/slate/grid/grid3-special-col-bg.gif) repeat-y right;\r
 333 }\r
 334 .x-grid3-body .x-grid3-row-selected .x-grid3-td-numberer,.x-grid3-body .x-grid3-row-selected .x-grid3-td-checker,.x-grid3-body .x-grid3-row-selected .x-grid3-td-expander{\r
 335         background:transparent url(../images/slate/grid/grid3-special-col-sel-bg.gif) repeat-y right;\r
 336 }\r
 337 .x-grid-group-hd{\r
 338         border-bottom:2px solid #abb;\r
 339 }\r
 340 .x-grid-group-hd div{\r
 341         color:#456;\r
 342 }\r
 343 .x-dd-drag-proxy .x-grid3-hd-inner{\r
 344         background:#ebf3fd url(../images/slate/grid/grid3-hrow-over.gif) repeat-x left bottom;\r
 345         border:1px solid #abc;\r
 346 }\r
 347 .x-tbar-page-first{\r
 348         background-image:url(../images/slate/grid/page-first.gif)!important;\r
 349 }\r
 350 .x-tbar-page-last{\r
 351         background-image:url(../images/slate/grid/page-last.gif)!important;\r
 352 }\r
 353 .x-tbar-page-next{\r
 354         background-image:url(../images/slate/grid/page-next.gif)!important;\r
 355 }\r
 356 .x-tbar-page-prev{\r
 357         background-image:url(../images/slate/grid/page-prev.gif)!important;\r
 358 }\r
 359 .x-tbar-loading{\r
 360         background-image:url(../images/slate/grid/refresh.gif)!important;\r
 361 }\r
 362 .x-paging-info{\r
 363         color:#ffffff;\r
 364 }\r
 365 \r
 366 \r
 367 /* Trees */\r
 368 \r
 369 .x-tree-node .x-tree-selected{\r
 370         background-color:#f7ecc1;\r
 371 }\r
 372 .x-tree-node .x-tree-selected a span{\r
 373         background-color:#f7ecc1;\r
 374         color:black;\r
 375 }\r
 376 .x-tree-arrows .x-tree-elbow-plus{\r
 377         background:transparent url(../images/slate/tree/arrows.gif) no-repeat 0 0;\r
 378 }\r
 379 .x-tree-arrows .x-tree-elbow-minus{\r
 380         background:transparent url(../images/slate/tree/arrows.gif) no-repeat -16px 0;\r
 381 }\r
 382 .x-tree-arrows .x-tree-elbow-end-plus{\r
 383         background:transparent url(../images/slate/tree/arrows.gif) no-repeat 0 0;\r
 384 }\r
 385 .x-tree-arrows .x-tree-elbow-end-minus{\r
 386         background:transparent url(../images/slate/tree/arrows.gif) no-repeat -16px 0;\r
 387 }\r
 388 \r
 389 \r
 390 /* Date Pickers */\r
 391 \r
 392 .x-date-middle,.x-date-left,.x-date-right{\r
 393         background:url(../images/slate/shared/hd-sprite.gif) repeat-x 0 -83px;\r
 394 }\r
 395 .x-date-bottom{\r
 396         background:#dfecfb url(../images/slate/shared/glass-bg.gif) repeat-x scroll left top;\r
 397         border-top:1px solid #abc;\r
 398 }\r
 399 .x-date-right a{\r
 400         background-image:url(../images/slate/shared/right-btn.gif);\r
 401 }\r
 402 .x-date-left a{\r
 403         background-image:url(../images/slate/shared/left-btn.gif);\r
 404 }\r
 405 .x-date-inner th{\r
 406         background:#dfecfb url(../images/slate/shared/glass-bg.gif) repeat-x left top;\r
 407         border-bottom:1px solid #abc;\r
 408         color:#345;\r
 409 }\r
 410 .x-date-inner .x-date-selected a{\r
 411         background:#dfecfb url(../images/slate/shared/glass-bg.gif) repeat-x scroll left top;\r
 412         border:1px solid #89a;\r
 413 }\r
 414 .x-date-inner a:hover,.x-date-inner .x-date-disabled a:hover{\r
 415         background:#faedc0;\r
 416 }\r
 417 td.x-date-mp-month a:hover,td.x-date-mp-year a:hover{\r
 418         color:#123;\r
 419         background:#faedc0;\r
 420 }\r
 421 .x-date-mp-ybtn a{\r
 422         background:transparent url(../images/slate/panel/tool-sprites.gif) no-repeat;\r
 423 }\r
 424 .x-date-mp-btns{\r
 425         background:#dfecfb url(../images/slate/shared/glass-bg.gif) repeat-x scroll left top;\r
 426 }\r
 427 td.x-date-mp-sel a{\r
 428         background:#dfecfb url(../images/slate/shared/glass-bg.gif) repeat-x left top;\r
 429         border:1px solid #abc;\r
 430 }\r
 431 .x-date-mp-btns button{\r
 432         background:#405574;\r
 433         border:1px solid;\r
 434         border-color:#abc #055 #055 #abc;\r
 435 }\r
 436 \r
 437 \r
 438 /* Tips */\r
 439 \r
 440 .x-tip .x-tip-close{\r
 441         background-image:url(../images/slate/qtip/close.gif);\r
 442 }\r
 443 .x-tip .x-tip-tc{\r
 444         background:transparent url(../images/slate/qtip/tip-sprite.gif) no-repeat 0 -62px;\r
 445 }\r
 446 .x-tip .x-tip-tl{\r
 447         background:transparent url(../images/slate/qtip/tip-sprite.gif) no-repeat 0 0;\r
 448 }\r
 449 .x-tip .x-tip-tr{\r
 450         background:transparent url(../images/slate/qtip/tip-sprite.gif) no-repeat right 0;\r
 451 }\r
 452 .x-tip .x-tip-bc{\r
 453         background:transparent url(../images/slate/qtip/tip-sprite.gif) no-repeat 0 -121px;\r
 454 }\r
 455 .x-tip .x-tip-bl{\r
 456         background:transparent url(../images/slate/qtip/tip-sprite.gif) no-repeat 0 -59px;\r
 457 }\r
 458 .x-tip .x-tip-br{\r
 459         background:transparent url(../images/slate/qtip/tip-sprite.gif) no-repeat right -59px;\r
 460 }\r
 461 .x-tip .x-tip-ml{\r
 462         background:#fff url(../images/slate/qtip/tip-sprite.gif) no-repeat 0 -124px;\r
 463 }\r
 464 .x-tip .x-tip-mr{\r
 465         background:transparent url(../images/slate/qtip/tip-sprite.gif) no-repeat right -124px;\r
 466 }\r
 467 .x-form-invalid-tip .x-tip-tc{\r
 468         background:url(../images/default/form/error-tip-corners.gif) repeat-x 0 -12px;padding-top:6px;\r
 469 }\r
 470 .x-form-invalid-tip .x-tip-tl{\r
 471         background-image:url(../images/default/form/error-tip-corners.gif);\r
 472 }\r
 473 .x-form-invalid-tip .x-tip-tr{\r
 474         background-image:url(../images/default/form/error-tip-corners.gif);\r
 475 }\r
 476 .x-form-invalid-tip .x-tip-bc{\r
 477         background:url(../images/default/form/error-tip-corners.gif) repeat-x 0 -18px;height:6px;\r
 478 }\r
 479 .x-form-invalid-tip .x-tip-bl{\r
 480         background:url(../images/default/form/error-tip-corners.gif) no-repeat 0 -6px;\r
 481 }\r
 482 .x-form-invalid-tip .x-tip-br{\r
 483         background:url(../images/default/form/error-tip-corners.gif) no-repeat right -6px;\r
 484 }\r
 485 .x-form-invalid-tip .x-tip-ml{\r
 486         background-image:url(../images/default/form/error-tip-corners.gif);\r
 487 }\r
 488 .x-form-invalid-tip .x-tip-mr{\r
 489         background-image:url(../images/default/form/error-tip-corners.gif);\r
 490 }\r
 491 \r
 492 \r
 493 /* Menus */\r
 494 \r
 495 .x-menu{\r
 496         border:1px solid #aaa;\r
 497         background:#f0f0f0 url(../images/slate/menu/menu.gif) repeat-y;\r
 498 }\r
 499 .x-menu-item-active{\r
 500         background:#ebf3fd url(../images/slate/menu/item-over.gif) repeat-x left bottom;\r
 501         border:1px solid #c2cbd2;\r
 502 }\r
 503 .x-menu-item-arrow{\r
 504         background:transparent url(../images/slate/menu/menu-parent.gif) no-repeat right;\r
 505 }\r
 506 .x-menu-check-item .x-menu-item-icon{\r
 507         background:transparent url(../images/slate/menu/unchecked.gif) no-repeat center;\r
 508 }\r
 509 .x-menu-item-checked .x-menu-item-icon{\r
 510         background-image:url(../images/slate/menu/checked.gif);\r
 511 }\r
 512 .x-menu-item-checked .x-menu-group-item .x-menu-item-icon{\r
 513         background:transparent url(../images/slate/menu/group-checked.gif)\r
 514 }\r
 515 .x-menu-group-item .x-menu-item-icon{\r
 516         background:transparent none repeat scroll 0 0;\r
 517 }\r
 518 \r
 519 \r
 520 /* Combos */\r
 521 \r
 522 .x-combo-list{\r
 523         border:1px solid #89a;\r
 524         background:#bdcbd4 none repeat scroll 0 0;\r
 525 }\r
 526 .x-combo-list .x-combo-selected{\r
 527         border:1px dotted #ccc!important;\r
 528         background:#fbf0d2;\r
 529 }\r
 530 .x-resizable-pinned .x-combo-list-inner{\r
 531         border-bottom:1px solid #9ab;\r
 532 }\r
 533 \r
 534 \r
 535 /* Panels */\r
 536 \r
 537 .x-panel{\r
 538     border-style:solid;\r
 539     border-color:#abc;\r
 540     border-width:0;\r
 541 }\r
 542 .x-panel-header{\r
 543     color:#f8f8f8;\r
 544         border:1px solid #abc;\r
 545     background-image:url(../images/slate/panel/white-top-bottom.gif);\r
 546 }\r
 547 .x-panel-body{\r
 548     border-color:#abc;\r
 549 }\r
 550 .x-panel-bbar .x-toolbar{\r
 551     border-color:#abc;\r
 552 }\r
 553 .x-panel-tbar .x-toolbar{\r
 554     border-color:#abc;\r
 555 }\r
 556 .x-panel-tbar-noheader .x-toolbar, .x-panel-mc .x-panel-tbar .x-toolbar{\r
 557     border-color:#abc;\r
 558 }\r
 559 .x-panel-body-noheader, .x-panel-mc .x-panel-body{\r
 560     border-color:#abc;\r
 561 }\r
 562 .x-panel-tl .x-panel-header{\r
 563     color:#f4f4f4;\r
 564 }\r
 565 .x-panel-tc{\r
 566         background-image:url(../images/slate/panel/top-bottom.gif);\r
 567 }\r
 568 .x-panel-tl{\r
 569         background-image:url(../images/slate/panel/corners-sprite.gif);\r
 570     border-color:#abc;\r
 571 }\r
 572 .x-panel-tr{\r
 573         background-image:url(../images/slate/panel/corners-sprite.gif);\r
 574 }\r
 575 .x-panel-bc{\r
 576         background-image:url(../images/slate/panel/top-bottom.gif);\r
 577 }\r
 578 .x-panel-bl{\r
 579         background-image:url(../images/slate/panel/corners-sprite.gif);\r
 580 }\r
 581 .x-panel-br{\r
 582         background-image:url(../images/slate/panel/corners-sprite.gif);\r
 583 }\r
 584 .x-panel-mc{\r
 585     background:#dde5e9;\r
 586 }\r
 587 .x-panel-mc .x-panel-body{\r
 588     background:transparent;\r
 589     border:0 none;\r
 590 }\r
 591 .x-panel-ml{\r
 592         background-image:url(../images/slate/panel/left-right.gif);\r
 593 }\r
 594 .x-panel-mr{\r
 595         background-image:url(../images/slate/panel/left-right.gif);\r
 596 }\r
 597 .x-panel-dd-spacer{\r
 598         border:2px dashed #89a;\r
 599 }\r
 600 .x-tool{\r
 601     background-image:url(../images/slate/panel/tool-sprites.gif);\r
 602 }\r
 603 .x-panel-ghost{\r
 604     background:#e0e0e0;\r
 605 }\r
 606 .x-panel-ghost ul{\r
 607     border-color:#b0b0b0;\r
 608 }\r
 609 \r
 610 \r
 611 /* Windows */\r
 612 \r
 613 .x-window-proxy{\r
 614     background:#e4e8ec;\r
 615     border-color:#abc;\r
 616 }\r
 617 .x-window-tl .x-window-header{\r
 618     color:#fafafa;\r
 619 }\r
 620 .x-window-tc{\r
 621         background-image:url(../images/slate/window/top-bottom.png);\r
 622 }\r
 623 .x-window-tl{\r
 624         background-image:url(../images/slate/window/left-corners.png);\r
 625 }\r
 626 .x-window-tr{\r
 627         background-image:url(../images/slate/window/right-corners.png);\r
 628 }\r
 629 .x-window-bc{\r
 630         background-image:url(../images/slate/window/top-bottom.png);\r
 631 }\r
 632 .x-window-bl{\r
 633         background-image:url(../images/slate/window/left-corners.png);\r
 634 }\r
 635 .x-window-br{\r
 636         background-image:url(../images/slate/window/right-corners.png);\r
 637 }\r
 638 .x-window-mc{\r
 639     border:1px solid #abc;\r
 640     background:#e8e8e8;\r
 641 }\r
 642 .x-window-ml{\r
 643         background-image:url(../images/slate/window/left-right.png);\r
 644 }\r
 645 .x-window-mr{\r
 646         background-image:url(../images/slate/window/left-right.png);\r
 647 }\r
 648 .x-panel-ghost .x-window-tl{\r
 649     border-color:#abc;\r
 650 }\r
 651 .x-panel-collapsed .x-window-tl{\r
 652     border-color:#abc;\r
 653 }\r
 654 .x-window-plain .x-window-mc{\r
 655     background:#e8e8e8;\r
 656     border-right:1px solid #eee;\r
 657     border-bottom:1px solid #eee;\r
 658     border-top:1px solid #abc;\r
 659     border-left:1px solid #abc;\r
 660 }\r
 661 .x-window-plain .x-window-body{\r
 662     border-left:1px solid #ddd;\r
 663     border-top:1px solid #ddd;\r
 664     border-bottom:1px solid #abc;\r
 665     border-right:1px solid #abc;\r
 666     background:transparent !important;\r
 667 }\r
 668 body.x-body-masked .x-window-mc, body.x-body-masked .x-window-plain .x-window-mc{\r
 669     background-color:#eceef0;\r
 670 }\r
 671 \r
 672 \r
 673 /* HTML Editors */\r
 674 \r
 675 .x-html-editor-wrap{\r
 676     border-color:#abc;\r
 677 }\r
 678 .x-html-editor-tb .x-btn-text{\r
 679         background:transparent url(../images/slate/editor/tb-sprite.gif) no-repeat scroll 0%;\r
 680 }\r
 681 \r
 682 \r
 683 /* Panel Borders */\r
 684 \r
 685 .x-panel-noborder .x-panel-body-noborder{\r
 686     border-width:0;\r
 687 }\r
 688 .x-panel-noborder .x-panel-header-noborder{\r
 689     border-width:0;\r
 690     border-bottom:1px solid #abc;\r
 691 }\r
 692 .x-panel-noborder .x-panel-tbar-noborder .x-toolbar{\r
 693     border-width:0;\r
 694     border-bottom:1px solid #abc;\r
 695 }\r
 696 .x-panel-noborder .x-panel-bbar-noborder .x-toolbar{\r
 697     border-width:0;\r
 698     border-top:1px solid #abc;\r
 699 }\r
 700 .x-window-noborder .x-window-mc{\r
 701     border-width:0;\r
 702 }\r
 703 .x-window-plain .x-window-body-noborder{\r
 704     border-width:0;\r
 705 }\r
 706 .x-tab-panel-noborder .x-tab-panel-body-noborder{\r
 707         border-width:0;\r
 708 }\r
 709 .x-tab-panel-noborder .x-tab-panel-header-noborder{\r
 710         border-top-width:0;\r
 711         border-left-width:0;\r
 712         border-right-width:0;\r
 713 }\r
 714 .x-tab-panel-noborder .x-tab-panel-footer-noborder{\r
 715         border-bottom-width:0;\r
 716         border-left-width:0;\r
 717         border-right-width:0;\r
 718 }\r
 719 .x-tab-panel-bbar-noborder .x-toolbar{\r
 720     border-width:0;\r
 721     border-top:1px solid #abc;\r
 722 }\r
 723 .x-tab-panel-tbar-noborder .x-toolbar{\r
 724     border-width:0;\r
 725     border-bottom:1px solid #abc;\r
 726 }\r
 727 \r
 728 \r
 729 /* Layout */\r
 730 \r
 731 .x-border-layout-ct{\r
 732     background:#f0f0f0;\r
 733 }\r
 734 .x-accordion-hd{\r
 735         background-image:url(../images/slate/panel/light-hd.gif);\r
 736 }\r
 737 .x-layout-collapsed{\r
 738     background-color:#567;\r
 739     border-color:#e0e0e0;\r
 740 }\r
 741 .x-layout-collapsed-over{\r
 742          background-color:#789;\r
 743 }\r
 744 \r
 745 \r
 746 /* Progress Bars */\r
 747 \r
 748 .x-progress-bar{\r
 749         background:#fbefb4 url(../images/slate/progress/progress-bg.gif) repeat-x left center;\r
 750         border-top:1px solid #ddd;\r
 751         border-bottom:1px solid #ddd;\r
 752 }\r
 753 .x-progress-inner{\r
 754         background:#e0e8f3 url(../images/slate/qtip/bg.gif) repeat-x scroll 0 0;\r
 755 }\r
 756 .x-progress-text{\r
 757         color:#9ab;\r
 758 }\r
 759 .x-progress-text-back{\r
 760         color:#789;\r
 761 }\r
 762 .x-progress-wrap{\r
 763         border:1px solid #b0b8c4;\r
 764 }\r
 765 \r
 766 \r
 767 /* Sliders */\r
 768 \r
 769 .x-slider-horz .x-slider-thumb{\r
 770         background:transparent url(../images/slate/slider/slider-thumb.png) no-repeat 0 0;\r
 771 }\r
 772 .x-slider-vert .x-slider-thumb{\r
 773         background:transparent url(../images/slate/slider/slider-v-thumb.png) no-repeat 0 0;\r
 774 }\r
 775 .x-slider-horz .x-slider-thumb-over{\r
 776         background-position:-14px -15px;\r
 777 }\r
 778 .x-slider-horz .x-slider-thumb-drag{\r
 779         background-position:-28px -30px;\r
 780 }\r
 781 .x-slider-vert .x-slider-thumb-over{\r
 782         background-position:-15px -14px;\r
 783 }\r
 784 .x-slider-vert .x-slider-thumb-drag{\r
 785         background-position:-30px -28px;\r
 786 }\r
 787 .x-slider-horz{\r
 788         background:transparent url(../images/slate/slider/slider-bg.png) no-repeat 0 -22px;\r
 789 }\r
 790 .x-slider-horz .x-slider-end{\r
 791         background:transparent url(../images/slate/slider/slider-bg.png) no-repeat right -44px;\r
 792 }\r
 793 .x-slider-horz .x-slider-inner{\r
 794         background:transparent url(../images/slate/slider/slider-bg.png) repeat-x 0 0;\r
 795 }\r
 796 .x-slider-vert{\r
 797         background:transparent url(../images/slate/slider/slider-v-bg.png) no-repeat -44px 0;\r
 798 }\r
 799 .x-slider-vert .x-slider-end{\r
 800         background:transparent url(../images/slate/slider/slider-v-bg.png) no-repeat -22px bottom;\r
 801 }\r
 802 .x-slider-vert .x-slider-inner{\r
 803         background:transparent url(../images/slate/slider/slider-v-bg.png) repeat-y 0 0;\r
 804 }\r