.#{$prefix}column-header {
border-right: $grid-column-header-border-width $grid-column-header-border-style $grid-header-border-color;
@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 $grid-column-header-border-style $grid-header-border-color;
}
}
.#{$prefix}group-sub-header {
background: transparent;
border-top: $grid-column-header-border-width $grid-column-header-border-style $grid-header-border-color;
// Because the sub-header has a top border, the padding of the inner is reduced by the border width
.#{$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 {
padding: $grid-header-padding;
text-overflow: ellipsis;
}
@if $supports-gradients {
.#{$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 {
@if $grid-header-background-gradient != null {
.#{$prefix}nlg {
.#{$prefix}grid-header-ct,
.#{$prefix}column-header {
background-image: slicer-background-image(column-header, 'grid/column-header-bg');
}
}
$stretch: slicer-background-stretch(column-header, bottom);
}
@if $grid-header-over-background-gradient != null {
.#{$prefix}nlg {
.#{$prefix}column-header-over,
.#{$prefix}column-header-sort-ASC,
.#{$prefix}column-header-sort-DESC {
background-image: slicer-background-image(column-header-over, 'grid/column-header-over-bg');
}
}
$stretch: slicer-background-stretch(column-header-over, bottom);
}
}
.#{$prefix}column-header-open {
background-color: $grid-header-open-background-color;
.#{$prefix}column-header-trigger {
background-color: $grid-header-trigger-background-color-open;
}
}
.#{$prefix}column-header-trigger {
width: $grid-header-trigger-width;
cursor: $grid-header-trigger-cursor;
background-color: $grid-header-trigger-background-color;
background-position: $grid-header-trigger-background-position;
}
@if $include-rtl {
.#{$prefix}rtl.#{$prefix}column-header-trigger {
background-position: rtl-background-position($grid-header-trigger-background-position);
}
}
$grid-column-align-right-margin:
$grid-header-trigger-width +
$grid-header-trigger-spacing -
right($grid-header-padding);
.#{$prefix}column-header-align-right .#{$prefix}column-header-text {
margin-right: $grid-column-align-right-margin;
}
@if $include-rtl {
.#{$prefix}column-header-align-right .#{$prefix}rtl.#{$prefix}column-header-text {
margin-right: 0;
margin-left: $grid-column-align-right-margin;
}
}
// 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-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);