examples/ext/resources/css/basic-dialog.css

   1 /*\r
   2  * Ext JS Library 1.1.1\r
   3  * Copyright(c) 2006-2007, Ext JS, LLC.\r
   4  * licensing@extjs.com\r
   5  * \r
   6  * http://www.extjs.com/license\r
   7  */\r
   8 \r
   9 .x-dlg-proxy {\r
  10         background-image: url(../images/default/gradient-bg.gif);\r
  11         background-color:#c3daf9;\r
  12         border:1px solid #6593cf;\r
  13         z-index:10001;\r
  14         overflow:hidden;\r
  15         position:absolute;\r
  16         left:0;top:0;\r
  17 }\r
  18 .x-dlg-shadow{\r
  19         background:#aaaaaa;\r
  20         position:absolute;\r
  21         left:0;top:0;\r
  22 }\r
  23 .x-dlg-focus{\r
  24         -moz-outline:0 none;\r
  25         outline:0 none;\r
  26         width:0;\r
  27         height:0;\r
  28         overflow:hidden;\r
  29         position:absolute;\r
  30         top:0;\r
  31         left:0;\r
  32 }\r
  33 .x-dlg-mask{\r
  34         z-index:10000;   \r
  35    display:none;\r
  36    position:absolute;\r
  37    top:0;\r
  38    left:0;\r
  39    -moz-opacity: 0.5;\r
  40    opacity:.50;\r
  41    filter: alpha(opacity=50);\r
  42    background-color:#CCC;\r
  43 }\r
  44 body.x-body-masked select {\r
  45         visibility:hidden;\r
  46 }\r
  47 body.x-body-masked .x-dlg select {\r
  48         visibility:visible;\r
  49 }\r
  50 .x-dlg{\r
  51         z-index:10001;\r
  52         overflow:hidden;\r
  53         position:absolute;\r
  54         left:300;top:0;\r
  55 }\r
  56 .x-dlg .x-dlg-hd {\r
  57         background: url(../images/default/basic-dialog/hd-sprite.gif) repeat-x 0 -82px;\r
  58         background-color:navy;\r
  59         color:#FFF;\r
  60         font:bold 12px "sans serif", tahoma, verdana, helvetica;\r
  61         overflow:hidden;\r
  62         padding:5px;\r
  63     white-space: nowrap;\r
  64 }\r
  65 .x-dlg .x-dlg-hd-left {\r
  66         background: url(../images/default/basic-dialog/hd-sprite.gif) no-repeat 0 -41px;\r
  67         padding-left:3px;\r
  68         margin:0;\r
  69 }\r
  70 .x-dlg .x-dlg-hd-right {\r
  71         background: url(../images/default/basic-dialog/hd-sprite.gif) no-repeat right 0;\r
  72         padding-right:3px;\r
  73 }\r
  74 .x-dlg .x-dlg-dlg-body{\r
  75         background:url(../images/default/layout/gradient-bg.gif);\r
  76         border:1px solid #6593cf;\r
  77         border-top:0 none;\r
  78         padding:10px;\r
  79         position:absolute;\r
  80         top:24px;left:0;\r
  81         z-index:1;\r
  82         overflow:hidden;\r
  83 }\r
  84 .x-dlg-collapsed .x-resizable-handle{\r
  85     display:none;\r
  86 }\r
  87 .x-dlg .x-dlg-bd{\r
  88         overflow:hidden;\r
  89 }\r
  90 .x-dlg .x-dlg-ft{\r
  91         overflow:hidden;\r
  92         padding:5px;\r
  93         padding-bottom:0;\r
  94 }\r
  95 \r
  96 .x-dlg .x-tabs-body{\r
  97         background:white;\r
  98         overflow:auto;\r
  99 }\r
 100 .x-dlg .x-tabs-top .x-tabs-body{\r
 101         border:1px solid #6593cf;\r
 102         border-top:0 none;\r
 103 }\r
 104 .x-dlg .x-tabs-bottom .x-tabs-body{\r
 105         border:1px solid #6593cf;\r
 106         border-bottom:0 none;\r
 107 }\r
 108 .x-dlg .x-layout-container  .x-tabs-body{\r
 109         border:0 none;\r
 110 }\r
 111 .x-dlg .inner-tab{\r
 112         margin:5px;\r
 113 }\r
 114 .x-dlg .x-dlg-ft .x-btn{\r
 115         margin-right:5px;\r
 116         float:right;\r
 117         clear:none;\r
 118 }\r
 119 .x-dlg .x-dlg-ft .x-dlg-btns td {\r
 120         border:0;\r
 121         padding:0;\r
 122 }\r
 123 .x-dlg .x-dlg-ft .x-dlg-btns-right table{\r
 124         float:right;\r
 125         clear:none;\r
 126 }\r
 127 .x-dlg .x-dlg-ft .x-dlg-btns-left table{\r
 128         float:left;\r
 129         clear:none;\r
 130 }\r
 131 .x-dlg .x-dlg-ft .x-dlg-btns-center{\r
 132         text-align:center; /*ie*/\r
 133 }\r
 134 .x-dlg .x-dlg-ft .x-dlg-btns-center table{\r
 135         margin:0 auto; /*everyone else*/\r
 136 }\r
 137 \r
 138 \r
 139 .x-dlg .x-dlg-ft .x-dlg-btns .x-btn-focus .x-btn-left{\r
 140         background-position:0 -147px;\r
 141 }\r
 142 .x-dlg .x-dlg-ft .x-dlg-btns .x-btn-focus .x-btn-right{\r
 143         background-position:0 -168px;\r
 144 }\r
 145 .x-dlg .x-dlg-ft .x-dlg-btns .x-btn-focus .x-btn-center{\r
 146         background-position:0 -189px;\r
 147 }\r
 148 \r
 149 .x-dlg .x-dlg-ft .x-dlg-btns .x-btn-click .x-btn-center{\r
 150         background-position:0 -126px;\r
 151 }\r
 152 .x-dlg .x-dlg-ft .x-dlg-btns .x-btn-click .x-btn-right{\r
 153         background-position:0 -84px;\r
 154 }\r
 155 .x-dlg .x-dlg-ft .x-dlg-btns .x-btn-click .x-btn-left{\r
 156         background-position:0 -63px;\r
 157 }\r
 158 \r
 159 .x-dlg-draggable .x-dlg-hd{\r
 160         cursor:move;\r
 161 }\r
 162 .x-dlg-closable .x-dlg-hd{\r
 163         padding-right:22px;\r
 164 }\r
 165 .x-dlg-toolbox {\r
 166     position:absolute;\r
 167         top:4px;\r
 168         right:4px;\r
 169         z-index:6;\r
 170     width:40px;\r
 171     cursor:default;\r
 172     height:15px;\r
 173     background:transparent;\r
 174 }\r
 175 .x-dlg .x-dlg-close, .x-dlg .x-dlg-collapse {\r
 176     float:right;\r
 177     height:15px;\r
 178         width:15px;\r
 179         margin:0;\r
 180     margin-left:2px;\r
 181     padding:0;\r
 182         line-height:1px;\r
 183         font-size:1px;\r
 184         background-repeat:no-repeat;\r
 185         cursor:pointer;\r
 186         visibility:inherit;\r
 187 }\r
 188 .x-dlg .x-dlg-close {\r
 189     background-image:url(../images/default/basic-dialog/close.gif);\r
 190 }\r
 191 .x-dlg .x-dlg-collapse {\r
 192     background-image:url(../images/default/basic-dialog/collapse.gif);\r
 193 }\r
 194 .x-dlg-collapsed .x-dlg-collapse {\r
 195     background-image:url(../images/default/basic-dialog/expand.gif);\r
 196 }\r
 197 .x-dlg .x-dlg-close-over, .x-dlg .x-dlg-collapse-over {\r
 198     \r
 199 }\r
 200 .x-dlg div.x-resizable-handle-east{\r
 201         background-image:url(../images/default/basic-dialog/e-handle.gif);\r
 202         border:0;\r
 203         background-position:right;\r
 204         margin-right:0;\r
 205 }\r
 206 .x-dlg div.x-resizable-handle-south{\r
 207         background-image:url(../images/default/sizer/s-handle-dark.gif);\r
 208         border:0;\r
 209         height:6px;\r
 210 }\r
 211 .x-dlg div.x-resizable-handle-west{\r
 212         background-image:url(../images/default/basic-dialog/e-handle.gif);\r
 213         border:0;\r
 214         background-position:1px;\r
 215 }\r
 216 .x-dlg div.x-resizable-handle-north{\r
 217         background-image:url(../images/default/s.gif);\r
 218         border:0;\r
 219 }\r
 220 .x-dlg div.x-resizable-handle-northeast, .xtheme-gray .x-dlg div.x-resizable-handle-northeast{\r
 221         background-image:url(../images/default/s.gif);\r
 222         border:0;\r
 223 }\r
 224 .x-dlg div.x-resizable-handle-northwest, .xtheme-gray .x-dlg div.x-resizable-handle-northwest{\r
 225         background-image:url(../images/default/s.gif);\r
 226         border:0;\r
 227 }\r
 228 .x-dlg div.x-resizable-handle-southeast{\r
 229         background-image:url(../images/default/basic-dialog/se-handle.gif);\r
 230         background-position: bottom right;\r
 231         width:8px;\r
 232         height:8px;\r
 233         border:0;\r
 234 }\r
 235 .x-dlg div.x-resizable-handle-southwest{\r
 236         background-image:url(../images/default/sizer/sw-handle-dark.gif);\r
 237         background-position: top right;\r
 238         margin-left:1px;\r
 239         margin-bottom:1px;\r
 240         border:0;\r
 241 }\r
 242 \r
 243 #x-msg-box .x-dlg-ft .x-btn{\r
 244         float:none;\r
 245         clear:none;\r
 246         margin:0 3px;\r
 247 }\r
 248 \r
 249 #x-msg-box .x-dlg-bd {\r
 250         padding:5px;\r
 251         overflow:hidden !important;\r
 252         font:normal 13px verdana,tahoma,sans-serif;\r
 253 }\r
 254 #x-msg-box .ext-mb-input {\r
 255         margin-top:4px;\r
 256         width:95%;\r
 257 }\r
 258 #x-msg-box .ext-mb-textarea {\r
 259         margin-top:4px;\r
 260         font:normal 13px verdana,tahoma,sans-serif;\r
 261 }\r
 262 #x-msg-box .ext-mb-progress-wrap {\r
 263         margin-top:4px;\r
 264         border:1px solid #6593cf;\r
 265 }\r
 266 #x-msg-box .ext-mb-progress {\r
 267         height:18px;\r
 268         background: #e0e8f3 url(../images/default/qtip/bg.gif) repeat-x;\r
 269 }\r
 270 #x-msg-box .ext-mb-progress-bar {\r
 271         height:18px;\r
 272         overflow:hidden;\r
 273         width:0;\r
 274         background:#8BB8F3;\r
 275         border-top:1px solid #B2D0F7;\r
 276         border-bottom:1px solid #65A1EF;\r
 277         border-right:1px solid #65A1EF;\r
 278 }\r
 279 \r
 280 #x-msg-box .x-msg-box-wait {\r
 281         background: transparent url(../images/default/grid/loading.gif) no-repeat left;\r
 282     display:block;\r
 283     width:300px;\r
 284     padding-left:18px;\r
 285     line-height:18px;\r
 286 }