resources/css/xtheme-gray.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 .x-panel {\r
  10     border-style: solid;\r
  11     border-color: #d0d0d0;\r
  12 }\r
  13 .x-panel-header {\r
  14     color:#333;\r
  15         border:1px solid #d0d0d0;\r
  16     background-image:url(../images/gray/panel/white-top-bottom.gif);\r
  17 }\r
  18 \r
  19 .x-panel-body {\r
  20     border-color:#d0d0d0;\r
  21 }\r
  22 \r
  23 .x-panel-bbar .x-toolbar {\r
  24     border-color:#d0d0d0;\r
  25 }\r
  26 \r
  27 .x-panel-tbar .x-toolbar {\r
  28     border-color:#d0d0d0;\r
  29 }\r
  30 \r
  31 .x-panel-tbar-noheader .x-toolbar, .x-panel-mc .x-panel-tbar .x-toolbar {\r
  32     border-color:#d0d0d0;\r
  33 }\r
  34 .x-panel-body-noheader, .x-panel-mc .x-panel-body {\r
  35     border-color:#d0d0d0;\r
  36 }\r
  37 .x-panel-tl .x-panel-header {\r
  38     color:#333;\r
  39 }\r
  40 .x-panel-tc {\r
  41         background-image:url(../images/gray/panel/top-bottom.gif);\r
  42 }\r
  43 .x-panel-tl {\r
  44         background-image:url(../images/gray/panel/corners-sprite.gif);\r
  45     border-color:#d0d0d0;\r
  46 }\r
  47 .x-panel-tr {\r
  48         background-image:url(../images/gray/panel/corners-sprite.gif);\r
  49 }\r
  50 .x-panel-bc {\r
  51         background-image:url(../images/gray/panel/top-bottom.gif);\r
  52 }\r
  53 .x-panel-bl {\r
  54         background-image:url(../images/gray/panel/corners-sprite.gif);\r
  55 }\r
  56 .x-panel-br {\r
  57         background-image:url(../images/gray/panel/corners-sprite.gif);\r
  58 }\r
  59 .x-panel-mc {\r
  60     background:#f1f1f1;\r
  61 }\r
  62 .x-panel-mc .x-panel-body {\r
  63     background:transparent;\r
  64     border: 0 none;\r
  65 }\r
  66 .x-panel-ml {\r
  67         background-image:url(../images/gray/panel/left-right.gif);\r
  68 }\r
  69 .x-panel-mr {\r
  70         background-image:url(../images/gray/panel/left-right.gif);\r
  71 }\r
  72 \r
  73 /* Tools */\r
  74 .x-tool {\r
  75     background-image:url(../images/gray/panel/tool-sprites.gif);\r
  76 }\r
  77 \r
  78 /* Ghosting */\r
  79 .x-panel-ghost {\r
  80     background:#e0e0e0;\r
  81 }\r
  82 \r
  83 .x-panel-ghost ul {\r
  84     border-color:#b0b0b0;\r
  85 }\r
  86 \r
  87 .x-grid-panel .x-panel-mc .x-panel-body {\r
  88     border:1px solid #d0d0d0;\r
  89 }\r
  90 \r
  91 /* Buttons */\r
  92 \r
  93 .x-btn-left{\r
  94         background-image:url(../images/gray/button/btn-sprite.gif);\r
  95 }\r
  96 .x-btn-right{\r
  97         background-image:url(../images/gray/button/btn-sprite.gif);\r
  98 }\r
  99 .x-btn-center{\r
 100         background-image:url(../images/gray/button/btn-sprite.gif);\r
 101 }\r
 102 \r
 103 /* Layout classes */\r
 104 \r
 105 .x-border-layout-ct {\r
 106     background:#f0f0f0;\r
 107 }\r
 108 \r
 109 .x-accordion-hd {\r
 110         background-image:url(../images/gray/panel/light-hd.gif);\r
 111 }\r
 112 \r
 113 .x-layout-collapsed{\r
 114     background-color:#eee;\r
 115     border-color:#e0e0e0;\r
 116 }\r
 117 .x-layout-collapsed-over{\r
 118          background-color:#fbfbfb;\r
 119 }\r
 120 \r
 121 \r
 122 /* qtips */\r
 123 .x-tip .x-tip-top {\r
 124         background-image:url(../images/gray/qtip/tip-sprite.gif);\r
 125 }\r
 126 .x-tip .x-tip-top-left {\r
 127         background-image:url(../images/gray/qtip/tip-sprite.gif);\r
 128 }\r
 129 .x-tip .x-tip-top-right {\r
 130         background-image:url(../images/gray/qtip/tip-sprite.gif);\r
 131 }\r
 132 .x-tip .x-tip-ft {\r
 133         background-image:url(../images/gray/qtip/tip-sprite.gif);\r
 134 }\r
 135 .x-tip .x-tip-ft-left {\r
 136         background-image:url(../images/gray/qtip/tip-sprite.gif);\r
 137 }\r
 138 .x-tip .x-tip-ft-right {\r
 139         background-image:url(../images/gray/qtip/tip-sprite.gif);\r
 140 }\r
 141 .x-tip .x-tip-bd-left {\r
 142         background-image:url(../images/gray/qtip/tip-sprite.gif);\r
 143 }\r
 144 .x-tip .x-tip-bd-right {\r
 145         background-image:url(../images/gray/qtip/tip-sprite.gif);\r
 146 }\r
 147 \r
 148 /* Toolbars */\r
 149 \r
 150 .x-toolbar{\r
 151         border-color:#d0d0d0;\r
 152     background:#f0f4f5 url(../images/gray/toolbar/bg.gif) repeat-x top left;\r
 153 }\r
 154 .x-toolbar button {\r
 155     color:#444;\r
 156 }\r
 157 .x-toolbar .x-btn-menu-arrow-wrap .x-btn-center button {\r
 158     background-image:url(../images/gray/toolbar/btn-arrow.gif);\r
 159 }\r
 160 .x-toolbar .x-btn-text-icon .x-btn-menu-arrow-wrap .x-btn-center button {\r
 161     background-image:url(../images/gray/toolbar/btn-arrow.gif);\r
 162 }\r
 163 .x-toolbar .x-btn-over .x-btn-left{\r
 164         background-image:url(../images/gray/toolbar/tb-btn-sprite.gif);\r
 165 }\r
 166 .x-toolbar .x-btn-over .x-btn-right{\r
 167         background-image:url(../images/gray/toolbar/tb-btn-sprite.gif);\r
 168 }\r
 169 .x-toolbar .x-btn-over .x-btn-center{\r
 170         background-image:url(../images/gray/toolbar/tb-btn-sprite.gif);\r
 171 }\r
 172 .x-toolbar .x-btn-over button {\r
 173     color:#111;\r
 174 }\r
 175 .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
 176         background-image:url(../images/gray/toolbar/tb-btn-sprite.gif);\r
 177 }\r
 178 .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
 179         background-image:url(../images/gray/toolbar/tb-btn-sprite.gif);\r
 180 }\r
 181 \r
 182 .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
 183         background-image:url(../images/gray/toolbar/tb-btn-sprite.gif);\r
 184 }\r
 185 .x-toolbar .ytb-sep {\r
 186         background-image: url(../images/default/grid/grid-split.gif);\r
 187 }\r
 188 \r
 189 /* Tabs */\r
 190 \r
 191 .x-tab-panel-header, .x-tab-panel-footer {\r
 192         background: #EAEAEA;\r
 193         border-color:#d0d0d0;\r
 194 }\r
 195 \r
 196 \r
 197 .x-tab-panel-header {\r
 198         border-color:#d0d0d0;\r
 199 }\r
 200 \r
 201 .x-tab-panel-footer {\r
 202         border-color:#d0d0d0;\r
 203 }\r
 204 \r
 205 ul.x-tab-strip-top{\r
 206         background:#dbdbdb url(../images/gray/tabs/tab-strip-bg.gif) repeat-x left top;\r
 207         border-color:#d0d0d0;\r
 208     padding-top: 2px;\r
 209 }\r
 210 \r
 211 ul.x-tab-strip-bottom{\r
 212         background-image:url(../images/gray/tabs/tab-strip-btm-bg.gif);\r
 213         border-color:#d0d0d0;\r
 214 }\r
 215 \r
 216 .x-tab-strip span.x-tab-strip-text {\r
 217         color:#333;\r
 218 }\r
 219 .x-tab-strip-over span.x-tab-strip-text {\r
 220         color:#111;\r
 221 }\r
 222 \r
 223 .x-tab-strip-active span.x-tab-strip-text {\r
 224         color:#333;\r
 225 }\r
 226 \r
 227 .x-tab-strip-disabled .x-tabs-text {\r
 228         color:#aaaaaa;\r
 229 }\r
 230 \r
 231 .x-tab-strip-top .x-tab-right {\r
 232         background-image:url(../images/gray/tabs/tabs-sprite.gif);\r
 233 }\r
 234 \r
 235 .x-tab-strip-top .x-tab-left {\r
 236         background-image:url(../images/gray/tabs/tabs-sprite.gif);\r
 237 }\r
 238 .x-tab-strip-top .x-tab-strip-inner {\r
 239         background-image:url(../images/gray/tabs/tabs-sprite.gif);\r
 240 }\r
 241 \r
 242 .x-tab-strip-bottom .x-tab-right {\r
 243         background-image:url(../images/gray/tabs/tab-btm-inactive-right-bg.gif);\r
 244 }\r
 245 \r
 246 .x-tab-strip-bottom .x-tab-left {\r
 247         background-image:url(../images/gray/tabs/tab-btm-inactive-left-bg.gif);\r
 248 }\r
 249 \r
 250 .x-tab-strip-bottom .x-tab-strip-active .x-tab-right {\r
 251         background-image:url(../images/gray/tabs/tab-btm-right-bg.gif);\r
 252 }\r
 253 \r
 254 .x-tab-strip-bottom .x-tab-strip-active .x-tab-left {\r
 255         background-image:url(../images/gray/tabs/tab-btm-left-bg.gif);\r
 256 }\r
 257 \r
 258 .x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {\r
 259         background-image:url(../images/gray/tabs/tab-close.gif);\r
 260 }\r
 261 .x-tab-strip .x-tab-strip-closable a.x-tab-strip-close:hover{\r
 262         background-image:url(../images/gray/tabs/tab-close.gif);\r
 263 }\r
 264 \r
 265 .x-tab-panel-body {\r
 266     border-color:#d0d0d0;\r
 267     background:#fff;\r
 268 }\r
 269 .x-tab-panel-bbar .x-toolbar {\r
 270     border-color: #d0d0d0;\r
 271 }\r
 272 \r
 273 .x-tab-panel-tbar .x-toolbar {\r
 274     border-color: #d0d0d0;\r
 275 }\r
 276 \r
 277 .x-tab-panel-header-plain .x-tab-strip-spacer,\r
 278 .x-tab-panel-footer-plain .x-tab-strip-spacer {\r
 279     border-color:#d0d0d0;\r
 280     background: #eaeaea;\r
 281 }\r
 282 \r
 283 .x-tab-scroller-left {\r
 284     background-image: url(../images/gray/tabs/scroll-left.gif);\r
 285     border-color:#aeaeae;\r
 286 }\r
 287 .x-tab-scroller-right {\r
 288     background-image: url(../images/gray/tabs/scroll-right.gif);\r
 289     border-color:#aeaeae;\r
 290 }\r
 291 \r
 292 /* Window */\r
 293 \r
 294 .x-window-proxy {\r
 295     background:#e0e0e0;\r
 296     border-color:#b0b0b0;\r
 297 }\r
 298 \r
 299 .x-window-tl .x-window-header {\r
 300     color:#555;\r
 301 }\r
 302 .x-window-tc {\r
 303         background-image:url(../images/gray/window/top-bottom.png);\r
 304 }\r
 305 .x-window-tl {\r
 306         background-image:url(../images/gray/window/left-corners.png);\r
 307 }\r
 308 .x-window-tr {\r
 309         background-image:url(../images/gray/window/right-corners.png);\r
 310 }\r
 311 .x-window-bc {\r
 312         background-image:url(../images/gray/window/top-bottom.png);\r
 313 }\r
 314 .x-window-bl {\r
 315         background-image:url(../images/gray/window/left-corners.png);\r
 316 }\r
 317 .x-window-br {\r
 318         background-image:url(../images/gray/window/right-corners.png);\r
 319 }\r
 320 .x-window-mc {\r
 321     border:1px solid #d0d0d0;\r
 322     background:#e8e8e8;\r
 323 }\r
 324 \r
 325 .x-window-ml {\r
 326         background-image:url(../images/gray/window/left-right.png);\r
 327 }\r
 328 .x-window-mr {\r
 329         background-image:url(../images/gray/window/left-right.png);\r
 330 }\r
 331 .x-panel-ghost .x-window-tl {\r
 332     border-color:#d0d0d0;\r
 333 }\r
 334 .x-panel-collapsed .x-window-tl {\r
 335     border-color:#d0d0d0;\r
 336 }\r
 337 \r
 338 .x-window-plain .x-window-mc {\r
 339     background: #e8e8e8;\r
 340     border-right:1px solid #eee;\r
 341     border-bottom:1px solid #eee;\r
 342     border-top:1px solid #d0d0d0;\r
 343     border-left:1px solid #d0d0d0;\r
 344 }\r
 345 \r
 346 .x-window-plain .x-window-body {\r
 347     border-left:1px solid #eee;\r
 348     border-top:1px solid #eee;\r
 349     border-bottom:1px solid #d0d0d0;\r
 350     border-right:1px solid #d0d0d0;\r
 351     background:transparent !important;\r
 352 }\r
 353 \r
 354 body.x-body-masked .x-window-mc, body.x-body-masked .x-window-plain .x-window-mc {\r
 355     background-color: #e4e4e4;\r
 356 }\r
 357 \r
 358 \r
 359 /* misc */\r
 360 .x-html-editor-wrap {\r
 361     border-color:#d0d0d0;\r
 362 }\r
 363 \r
 364 /* Borders go last for specificity */\r
 365 .x-panel-noborder .x-panel-body-noborder {\r
 366     border-width:0;\r
 367 }\r
 368 \r
 369 .x-panel-noborder .x-panel-header-noborder {\r
 370     border-width:0;\r
 371     border-bottom:1px solid #d0d0d0;\r
 372 }\r
 373 \r
 374 .x-panel-noborder .x-panel-tbar-noborder .x-toolbar {\r
 375     border-width:0;\r
 376     border-bottom:1px solid #d0d0d0;\r
 377 }\r
 378 \r
 379 .x-panel-noborder .x-panel-bbar-noborder .x-toolbar {\r
 380     border-width:0;\r
 381     border-top:1px solid #d0d0d0;\r
 382 }\r
 383 \r
 384 .x-window-noborder .x-window-mc {\r
 385     border-width:0;\r
 386 }\r
 387 .x-window-plain .x-window-body-noborder {\r
 388     border-width:0;\r
 389 }\r
 390 \r
 391 .x-tab-panel-noborder .x-tab-panel-body-noborder {\r
 392         border-width:0;\r
 393 }\r
 394 \r
 395 .x-tab-panel-noborder .x-tab-panel-header-noborder {\r
 396         border-top-width:0;\r
 397         border-left-width:0;\r
 398         border-right-width:0;\r
 399 }\r
 400 \r
 401 .x-tab-panel-noborder .x-tab-panel-footer-noborder {\r
 402         border-bottom-width:0;\r
 403         border-left-width:0;\r
 404         border-right-width:0;\r
 405 }\r
 406 \r
 407 \r
 408 .x-tab-panel-bbar-noborder .x-toolbar {\r
 409     border-width:0;\r
 410     border-top:1px solid #d0d0d0;\r
 411 }\r
 412 \r
 413 .x-tab-panel-tbar-noborder .x-toolbar {\r
 414     border-width:0;\r
 415     border-bottom:1px solid #d0d0d0;\r
 416 }