git.roojs.org Git - roojs1/blob - css/grid.css

   1 /* <script type="text/javascript"> */
   2 /** unknown styles from new grid **/
   3
   4 /*
   5 .x-layout-grid-wrapper
   6
   7
   8 .x-grid-container
   9
  10
  11 .x-grid
  12 */
  13
  14
  15
  16
  17 .x-grid {
  18     background-color:#FFFFFF;
  19     position:relative;
  20     overflow:hidden;
  21
  22 }
  23
  24 .x-grid-locked,
  25 .x-grid-viewport
  26 {
  27
  28     position: absolute;
  29     display: block;
  30     z-index: 2;
  31     top: 0px;
  32     left: 0px;
  33     overflow: hidden;
  34 }
  35  .x-grid-scroller {
  36     overflow: auto;
  37 }
  38
  39
  40 .x-grid-hd-text {
  41         font-size: 8pt;
  42     padding-left: 6px;
  43 }
  44 .x-grid-hd-text,
  45 .x-grid-cell-text {\r
  46         display: block;\r
  47         overflow: hidden;\r
  48         padding: 3px 5px;
  49     /* stops jumping? */
  50     -moz-user-select: none;\r
  51 /*      white-space: nowrap; */\r
  52 }\r
  53 .x-grid-col{\r
  54         cursor: default;\r
  55         height:16px !important;\r
  56         box-sizing: border-box;\r
  57         -moz-box-sizing: border-box;\r
  58 /*      position:absolute; \r
  59         display:block;
  60     */\r
  61         -moz-outline: none;\r
  62         -moz-user-focus: normal;\r
  63         overflow: hidden;\r
  64         border-left: 1px solid #f1efe2;\r
  65 }\r
  66 .x-edit-grid .x-grid-col{\r
  67         -moz-outline: normal;\r
  68 }\r
  69 .x-grid-col, .x-grid-header {\r
  70         -o-text-overflow: ellipsis;\r
  71         text-overflow: ellipsis;\r
  72 }\r
  73 .x-grid-col-0{\r
  74         border-left: 0;\r
  75 }\r
  76 .x-grid-col-last{\r
  77         border-right: 1px solid #f1efe2;\r
  78 }\r
  79 .x-grid-editor {\r
  80         box-sizing: border-box;\r
  81         -moz-box-sizing: border-box;\r
  82         /* position:absolute; */\r
  83         /* visibility:hidden; */\r
  84         font: normal 8pt arial;\r
  85         border: 1px solid #afbdc9;\r
  86         z-index:10;\r
  87 }\r
  88 .x-grid-editor input{\r
  89         font: normal 8pt arial;\r
  90         border: 0;\r
  91         padding-top:2px;\r
  92         padding-left:3px;
  93     height: 18px;\r
  94 }\r
  95 .x-grid-editor-container{\r
  96         overflow:hidden;\r
  97         display:block;\r
  98         background-color:white;\r
  99 }\r
 100 .x-grid-editor .pick-button{\r
 101         width:15px;\r
 102         height:20px;\r
 103         position:absolute;\r
 104         display:block;\r
 105         right:0;\r
 106         top:0;\r
 107         z-index:2;\r
 108         background-image: url(../images/default/grid/pick-button.gif);\r
 109         background-repeat: no-repeat;\r
 110 }\r
 111 .x-grid-editor-invalid{\r
 112         background-image: url(../images/default/grid/invalid_line.gif);\r
 113         background-repeat: repeat-x;\r
 114         background-position: bottom;\r
 115         border: 1px solid #afbdc9;\r
 116 }\r
 117 .x-grid-checkbox-editor{\r
 118         text-align: center;\r
 119         overflow:hidden;\r
 120         display:block;\r
 121         background-color:white;\r
 122 }\r
 123 .x-grid-checkbox-editor input{\r
 124         margin-top:3px;\r
 125         height:13px;\r
 126         width:13px;\r
 127 }\r
 128 select.x-grid-editor{\r
 129         padding: 0;\r
 130         -moz-outline: none;\r
 131         border: 1px solid #afbdc9;\r
 132 }\r
 133 .x-grid-num-editor{\r
 134         text-align:right;\r
 135         padding-top:2px;\r
 136         padding-left:3px;\r
 137 }\r
 138 .x-grid-text-editor{\r
 139         padding-top:2px;\r
 140         padding-left:3px;\r
 141 }\r
 142 .x-grid-header {\r
 143         font: normal 8pt arial;\r
 144         background-color: #ebeadb;\r
 145         box-sizing: border-box;\r
 146         -moz-box-sizing: border-box;\r
 147         display: block;\r
 148         position: absolute;\r
 149         overflow:hidden;
 150     width: 100%;
 151     height: 22px;
 152     border-bottom: 1px solid #333;
 153     cursor: pointer;\r
 154 }\r
 155 .x-grid-column-sizer {\r
 156         width:1px;\r
 157         border-right:1px dashed #6593cf;\r
 158         background:none;\r
 159         cursor: col-resize;\r
 160 }\r
 161 .x-grid-drag-proxy{\r
 162         width:150px;\r
 163         height:24px;\r
 164         background-color:#3366cc;\r
 165         border: 1px solid #002266;\r
 166         position:absolute;\r
 167         visibility:hidden;\r
 168         z-index:10000;\r
 169 }\r
 170 .x-grid-drag-text{\r
 171    font: normal 8pt arial;\r
 172         color:white;\r
 173         position:absolute;\r
 174         top:0;\r
 175         left:26px;\r
 176         padding:3px;\r
 177         display:block;\r
 178 }\r
 179 .x-grid-drop-icon{\r
 180    position:absolute;\r
 181         top:0;\r
 182         left:0;\r
 183         display:block;\r
 184         width:24px;\r
 185         height:100%;\r
 186         background-position: center;\r
 187         background-repeat: no-repeat;\r
 188 }\r
 189 .x-grid-drop-nodrop{\r
 190    background-image: url(../images/default/grid/drop-no.gif);\r
 191 }\r
 192 .x-grid-drop-ok{\r
 193    background-image: url(../images/default/grid/drop-yes.gif);\r
 194 }
 195
 196 .x-grid-hd-row img.x-grid-sort-icon {
 197     height: 4px;
 198         width: 13px;
 199     border: 0;
 200     margin-left: 4px;
 201     vertical-align: middle;
 202
 203 }\r
 204 .x-grid-hd-row .sort-asc img.x-grid-sort-icon {\r
 205         background-image: url(../images/default/grid/sort_asc.gif);\r
 206         background-position: right;\r
 207         background-repeat: no-repeat;\r
 208         /* display: none; */\r
 209  \r
 210 }\r
 211 .x-grid-hd-row .sort-desc img.x-grid-sort-icon {\r
 212         background-image: url(../images/default/grid/sort_desc.gif);\r
 213         background-position: right;\r
 214         background-repeat: no-repeat;\r
 215         /* display: none; */\r
 216  \r
 217 }\r
 218 .x-grid-hd-body {\r
 219         cursor: default;\r
 220         display: block;\r
 221         font: normal 8pt arial;\r
 222         left: 0;\r
 223         overflow: hidden;\r
 224         padding: 3px 5px;\r
 225         position: relative;\r
 226         top: 0;\r
 227         white-space: nowrap;\r
 228 }\r
 229 .x-grid-hd-body span {\r
 230         font: normal 8pt arial;\r
 231         white-space: nowrap; \r
 232 }\r
 233 .x-grid-hd-over{\r
 234         border-bottom: 2px solid #fcc247;\r
 235 }\r
 236 .x-grid-hd-over .x-grid-hd-body{\r
 237         background-color: #faf9f4;\r
 238         border-bottom: 1px solid #f9a900;\r
 239 }\r
 240 .x-grid-split {\r
 241         background-image: url(../images/default/grid/grid-split.gif);\r
 242         background-position: center;\r
 243         background-repeat: no-repeat;\r
 244         cursor: e-resize;\r
 245         display: block;\r
 246         font-size: 1px;\r
 247         height: 16px;\r
 248         overflow: hidden;\r
 249         position: absolute;\r
 250         top: 2px;\r
 251         width: 6px;\r
 252         z-index: 3;\r
 253 }\r
 254 .x-grid-hrow{\r
 255         background: #ebeadb url(../images/default/grid/grid-hrow.gif) repeat-x;\r
 256         display: block;\r
 257         height: 22px;\r
 258         left: 0;\r
 259         position: relative;\r
 260         top: 0;\r
 261         width: 10000px;\r
 262         overflow:hidden;\r
 263         z-index:2;\r
 264 }\r
 265 .x-grid-hrow-frame{\r
 266         height: 22px;\r
 267         left: 0;\r
 268         display:block;\r
 269         position: absolute;\r
 270         top: 0;\r
 271         width: 10000px;\r
 272         z-index:1;\r
 273 }\r
 274 .x-grid-footer .x-toolbar{\r
 275         border:0;\r
 276 }\r
 277 .x-grid-page-number{\r
 278         width:24px;\r
 279         height:14px;    \r
 280 }
 281
 282  \r
 283 .x-grid-page-first button {\r
 284         background: url(../images/default/grid/page-first.gif) no-repeat;
 285     width:16px;\r
 286 }\r
 287 .x-grid-loading button {\r
 288         background: url(../images/default/grid/done.gif) no-repeat;
 289     width:16px;\r
 290 }\r
 291 .x-grid-page-last button {\r
 292         background: url(../images/default/grid/page-last.gif) no-repeat;
 293     width:16px;\r
 294 }
 295 .x-date-mp-next,\r
 296 .x-grid-page-next button
 297 {\r
 298         background: url(../images/default/grid/page-next.gif) no-repeat;
 299     width:16px;\r
 300 }
 301 .x-date-mp-prev,\r
 302 .x-grid-page-prev button
 303 {\r
 304         background: url(../images/default/grid/page-prev.gif) no-repeat;
 305     width:16px;\r
 306 }
 307 .x-date-mp-prev,
 308 .x-date-mp-next
 309 {
 310     display: block;
 311     width: 16px;
 312     height: 16px;
 313 }
 314
 315
 316 \r
 317 .x-item-disabled .x-grid-loading button {\r
 318         background: url(../images/default/grid/loading.gif) no-repeat;\r
 319 }\r
 320 .x-item-disabled .x-grid-page-first button {\r
 321         background: url(../images/default/grid/page-first-disabled.gif) no-repeat;\r
 322 }\r
 323 .x-item-disabled .x-grid-page-last button {\r
 324         background: url(../images/default/grid/page-last-disabled.gif) no-repeat;\r
 325 }\r
 326 .x-item-disabled .x-grid-page-next button {\r
 327         background: url(../images/default/grid/page-next-disabled.gif) no-repeat;\r
 328 }\r
 329 .x-item-disabled .x-grid-page-prev button {\r
 330         background: url(../images/default/grid/page-prev-disabled.gif) no-repeat;\r
 331 }\r
 332 .x-grid-mso{\r
 333 }\r
 334 .x-grid-mso .x-grid-header{\r
 335         background:none;\r
 336         border-bottom:0;\r
 337 }\r
 338 .x-grid-mso .x-grid-footer {\r
 339         border-top: 1px solid #6593cf;\r
 340 }\r
 341 \r
 342 .x-grid-mso .x-grid-footer .x-grid-fbutton{\r
 343         border:0;\r
 344 }\r
 345 .x-grid-mso .x-grid-hd-body {\r
 346         border-bottom:0;\r
 347 }\r
 348 .x-grid-mso .x-grid-hd-over{\r
 349         border-bottom:0;\r
 350 }\r
 351 .x-grid-mso .x-grid-hd-over .x-grid-hd-body{\r
 352         background-color: transparent;\r
 353 }\r
 354 .x-grid-mso .x-grid-split {\r
 355         background-image: url(../images/default/grid/grid-blue-split.gif);\r
 356 }\r
 357 .x-grid-mso .x-toolbar .x-tb-sep {\r
 358         background-image: url(../images/default/grid/grid-blue-split.gif);\r
 359 }\r
 360 .x-grid-mso .x-grid-hrow{\r
 361         background: url(../images/default/grid/mso-hd.gif);\r
 362         border-bottom: 1px solid #6593cf;\r
 363         height: 21px;\r
 364 }\r
 365 .x-grid-mso .x-grid-row{\r
 366         color: black;\r
 367         border-bottom: 1px solid #ddecfe;\r
 368 }\r
 369 .x-grid-mso .x-grid-row-alt{\r
 370         background-color: #f5f5f5;\r
 371 }\r
 372 .x-grid-mso .x-grid-row-selected{\r
 373         background-color: #b3c8e8  !important;\r
 374         color: black;\r
 375 }\r
 376 .x-grid-mso .x-grid-row-selected span{\r
 377         color: black !important;\r
 378 }\r
 379 .x-props-grid .x-grid-col-1{\r
 380          background-color: #f1efe2;\r
 381 }\r
 382 .x-props-grid .x-grid-col-1 .x-grid-cell-text{\r
 383          background-color: white;\r
 384 }\r
 385 .x-props-grid .x-grid-col-0{\r
 386          background-color: #f1efe2;\r
 387 }\r
 388 .x-props-grid .x-grid-col-0 .x-grid-cell-text{\r
 389          background-color: white;\r
 390          margin-left:10px;\r
 391 }\r
 392 .x-props-grid .x-grid-prop-edting .x-grid-col-0 .x-grid-cell-text{\r
 393          background-color: #316ac5;\r
 394          color: white;\r
 395 }\r
 396 .x-props-grid .x-grid-prop-edting .x-grid-col-0{\r
 397          color: white;\r
 398 }\r
 399 .x-props-grid .x-grid-num-editor{\r
 400         text-align:left;\r
 401 }\r
 402 .x-grid-row td,
 403 .x-grid-hd-row td
 404 {\r
 405         font: normal 8pt tahoma,arial,helvetica;\r
 406         border-bottom: 1px solid #f1efe2;
 407     border-left: 1px solid #f1efe2;\r
 408         overflow: visible;\r
 409         white-space: nowrap;\r
 410         /* height:21px; */\r
 411         /* width:10000px; */\r
 412         /* box-sizing: border-box;\r
 413         -moz-box-sizing: border-box;\r
 414         display:block;
 415     */\r
 416         /* position:absolute; */\r
 417 }\r
 418 .x-grid-row-alt{\r
 419         background-color: #fcfaf6;\r
 420 }\r
 421 .x-grid-row-over{\r
 422         background-color: #f1f1f1;\r
 423         color: black;\r
 424 }
 425 .x-grid-cell-selected,\r
 426 .x-grid-row-selected {\r
 427         background-color: #316ac5 !important;\r
 428         color: white;\r
 429 }
 430 /*.x-grid-row-selected span{
 431         color: white !important;
 432 }
 433 */
 434
 435
 436
 437 /* \r
 438   To have the scrollbars overlap the header, change .x-grid-wrap top style to 0 and \r
 439   and ygrid-wrap-body top to 22px\r
 440   Then grid.getView().scrollbarMode = YAHOO.ext.grid.GridView.SCROLLBARS_OVERLAP;\r
 441  */\r
 442 .x-grid-body {\r
 443         height: 100%;\r
 444         left: 0;\r
 445         overflow: hidden;\r
 446         position: relative;\r
 447         top: 22px;\r
 448         /* width: 100%; */\r
 449 }\r
 450 .x-grid-footer{\r
 451         display: block;\r
 452         padding:0;\r
 453         border-top: 1px solid #cbc7b8;\r
 454 }\r
 455 .x-grid-wrap-footer {\r
 456         display: block;\r
 457         overflow: hidden;\r
 458         width:100%;\r
 459         height:25px;\r
 460         box-sizing: border-box;\r
 461         -moz-box-sizing: border-box;\r
 462         background-color: #ebeadb;\r
 463         position:absolute;\r
 464         bottom:0;\r
 465 }\r
 466 .x-grid-wrap-body {\r
 467         left: 0;\r
 468         overflow: hidden;\r
 469         position: absolute;\r
 470         top: 0;\r
 471         display: block;\r
 472 }\r
 473 .x-grid-wrap-headers {\r
 474         left: 0;\r
 475         overflow: hidden;\r
 476         position: absolute;\r
 477         top: 0;\r
 478         z-index: 12;\r
 479 }
 480
 481
 482
 483 .x-grid-simple-view .x-grid-col{
 484          height:100% !important;
 485          position:static;
 486          display:table-cell;
 487          display:inline-block;
 488 }
 489 .x-grid-simple-view .x-grid-row{
 490          position:static;
 491          display: table-row;
 492 }
 493
 494  /* -----------------------   PAGING ---------------------- */
 495
 496  .x-paging-info
 497  {
 498      position: absolute;
 499      right: 7px;
 500      top: 7px;
 501 }
 502
 503 .x-grid-topbar, .x-grid-bottombar
 504 {
 505     line-height: 0px;
 506     display: none;
 507     position: relative;
 508     height: 24px;
 509     top: 0;
 510
 511 }
 512 /* --- checkbox wrapping hides background -- */
 513 .x-grid-editor .x-form-check-wrap {
 514     background-color:#FFFFFF;
 515     padding: 2px 0px;
 516
 517 }