.#{$prefix}column-header { padding: 0; position: absolute; overflow: hidden; border: 0 none; border-right: $grid-column-header-border-width solid $grid-header-border-color; text-shadow: 0 1px 0 rgba(255, 255, 255, .3); @if $grid-column-header-color { color: $grid-column-header-color; } font: $grid-column-header-font; @if ($supports-gradients or $compile-all) and $grid-header-background-gradient != null { @include background-gradient($grid-header-background-color, $grid-header-background-gradient); } @if $grid-header-background-gradient == null { background-color: $grid-header-background-color; } } @if $include-rtl { .#{$prefix}rtl.#{$prefix}column-header { border-right: 0 none; border-left: $grid-column-header-border-width solid $grid-header-border-color; } } .#{$prefix}group-header { padding: 0; border-left-width: 0; } .#{$prefix}group-sub-header { background: transparent; border-top: $grid-column-header-border-width solid $grid-header-border-color; border-left-width: 0; // Because the sub-header has a top border, the padding of the inner is reduced by 1px .#{$prefix}column-header-inner { padding: top($grid-header-padding) - $grid-column-header-border-width right($grid-header-padding) bottom($grid-header-padding) left($grid-header-padding); } } .#{$prefix}column-header-inner { zoom: 1; white-space: nowrap; padding: $grid-header-padding; position: relative; .#{$prefix}column-header-text { white-space: nowrap; } } @if $include-rtl { .#{$prefix}ie { .#{$prefix}rtl.#{$prefix}column-header-text { // in all version of IE except for 8 strict, left and right padding are // automatically reversed on inline elements when the direction property // is "rtl". triggering hasLayout corrects this bug in IE6/7/quirks, and // display: inline-block is used for IE9/10 zoom: 1; display: inline-block; } } } @if ($supports-gradients or $compile-all) and $grid-header-over-background-gradient != null { .#{$prefix}column-header-over, .#{$prefix}column-header-sort-ASC, .#{$prefix}column-header-sort-DESC { @include background-gradient($grid-header-over-background-color, $grid-header-over-background-gradient); } } @if not $supports-gradients or $compile-all { .#{$prefix}nlg { .#{$prefix}grid-header-ct, .#{$prefix}column-header { background: repeat-x 0 top; background-image: slicer-background-image(column-header, 'grid/column-header-bg'); } .#{$prefix}column-header-over, .#{$prefix}column-header-sort-ASC, .#{$prefix}column-header-sort-DESC { background: #ebf3fd repeat-x 0 top; background-image: slicer-background-image(column-header-over, 'grid/column-header-over-bg'); } } } .#{$prefix}column-header-trigger { display: none; height: 100%; width: $grid-header-trigger-width; background-repeat: no-repeat; position: absolute; right: 0; top: 0; z-index: 2; cursor: pointer; } @if $include-rtl { .#{$prefix}rtl.#{$prefix}column-header-trigger { left: 0; right: auto; } } .#{$prefix}column-header-over, .#{$prefix}column-header-open { .#{$prefix}column-header-trigger { display: block; } } .#{$prefix}column-header-align-right { text-align: right; .#{$prefix}column-header-text { margin-right: $grid-column-align-right-margin; } } @if $include-rtl { .#{$prefix}rtl.#{$prefix}column-header-align-right { text-align: left; } .#{$prefix}column-header-align-right .#{$prefix}rtl.#{$prefix}column-header-text { margin-right: 0; margin-left: $grid-column-align-right-margin; } .#{$prefix}rtl.#{$prefix}column-header-align-left { text-align: right; } } .#{$prefix}column-header-align-center { text-align: center; } .#{$prefix}column-header-align-left { text-align: left; } // Sort direction indicator is a background of the text span. .#{$prefix}column-header-sort-ASC, .#{$prefix}column-header-sort-DESC { .#{$prefix}column-header-text { padding-right: $grid-header-sort-icon-width + $grid-header-sort-icon-spacing; background-repeat: no-repeat; background-position: $grid-header-sort-icon-position; } } @if $include-rtl { .#{$prefix}column-header-sort-ASC, .#{$prefix}column-header-sort-DESC { .#{$prefix}rtl.#{$prefix}column-header-text { padding-right: 0; padding-left: $grid-header-sort-icon-width + $grid-header-sort-icon-spacing; background-position: rtl-background-position($grid-header-sort-icon-position); } } } .#{$prefix}column-header-sort-ASC .#{$prefix}column-header-text { background-image: theme-background-image('grid/sort_asc'); } .#{$prefix}column-header-sort-DESC .#{$prefix}column-header-text { background-image: theme-background-image('grid/sort_desc'); } @include x-slicer(column-header); @include x-slicer(column-header-over);