extjs/modern/theme-base/sass/src/grid/Grid.scss

   1 .#{$prefix}grid .#{$prefix}dock-body > .#{$prefix}body {
   2     width: 100%;
   3 }
   4
   5 .#{$prefix}grid {
   6     .#{$prefix}grid-emptytext {
   7         text-align: center;
   8         pointer-events: none;
   9         color: #333;
  10         @include st-box();
  11         @include st-box-orient(vertical);
  12         @include st-box-pack(center);
  13     }
  14 }
  15
  16 .#{$prefix}grid-header-container {
  17     overflow: hidden;
  18 }
  19
  20 .#{$prefix}grid-headergroup-text {
  21     text-align: center;
  22     overflow: hidden;
  23     text-overflow: ellipsis;
  24 }
  25
  26 .#{$prefix}grid-row {
  27     position: absolute;
  28     left: 0;
  29     top: 0;
  30     display: table;
  31     table-layout: fixed;
  32     // An explicit width is required for table-layout: fixed to be applied, even if the columns
  33     // have their own explicit widths set
  34     // http://www.w3.org/TR/CSS21/tables.html#fixed-table-layout
  35     width: 0;
  36 }
  37
  38 .#{$prefix}grid-cell {
  39     display: table-cell;
  40     vertical-align: middle;
  41     overflow: hidden;
  42 }
  43
  44 .#{$prefix}grid-cell-inner {
  45     text-overflow: ellipsis;
  46     overflow: hidden;
  47     white-space: nowrap;
  48 }
  49
  50 .#{$prefix}grid-cell-hidden {
  51     display: none;
  52 }
  53
  54 .#{$prefix}grid-cell-align-center,
  55 .#{$prefix}grid-column-align-center {
  56     text-align: center;
  57 }
  58
  59 .#{$prefix}grid-cell-align-right,
  60 .#{$prefix}grid-column-align-right {
  61     text-align: right;
  62 }
  63
  64 .#{$prefix}grid-viewoptions {
  65     border-width: 0 0 0 1px;
  66     border-style: solid;
  67
  68     .#{$prefix}list-item.#{$prefix}item-selected.#{$prefix}list-item-tpl,
  69     .#{$prefix}list-item.#{$prefix}item-pressed.#{$prefix}list-item-tpl  {
  70         background: transparent;
  71         .#{$prefix}innerhtml {
  72             background: transparent;
  73         }
  74     }
  75 }
  76
  77 .#{$prefix}grid-columnoptions {
  78     border-width: 0 0 1px;
  79 }
  80
  81 .#{$prefix}grid-pagingtoolbar {
  82     > .#{$prefix}body {
  83         @include st-box-align(center);
  84     }
  85 }
  86
  87 .#{$prefix}grid-pagingtoolbar-currentpage {
  88     position: relative;
  89     height: 22px;
  90
  91     span {
  92         position: absolute;
  93         right: 0;
  94         top: 0;
  95         line-height: 22px;
  96         height: 22px;
  97     }
  98 }
  99
 100 .#{$prefix}grid-summaryrow {
 101     position: relative;
 102 }
 103
 104 .#{$prefix}grid-summaryrow .#{$prefix}grid-multiselection-cell:after {
 105     content: '';
 106 }
 107
 108 // Provides ability to capture events on the grid
 109 .#{$prefix}ie .#{$prefix}grid-grouped .#{$prefix}translatable-container {
 110     .#{$prefix}grid-row, .#{$prefix}grid-header {
 111         &:before {
 112             content: ". .";
 113             color: transparent;
 114             position: absolute;
 115             left: 0px;
 116             word-spacing: 3000px;
 117             opacity: 0;
 118         }
 119     }
 120 }
 121
 122 .#{$prefix}grid-header {
 123     position: absolute;
 124     left: 0;
 125     width: 100%;
 126     z-index: 2 !important;
 127 }
 128
 129 .#{$prefix}ios .#{$prefix}grid-header {
 130     @include transform(translate3d(0, 0, 0));
 131 }
 132
 133 .#{$prefix}grid-grouped .#{$prefix}grid-row.#{$prefix}grid-header-wrap .#{$prefix}dock-horizontal,
 134 .#{$prefix}grid-grouped .#{$prefix}grid-row-tpl.#{$prefix}grid-header-wrap {
 135     border-top: 0;
 136 }