add extjs 6.0.1 sources

[extjs.git] / extjs / modern / theme-neptune / sass / src / grid / Grid.scss

// Default grid styling\r
.x-grid-cell {\r
    background-color: $grid-cell-background-color;\r
    color: $grid-cell-color;\r
\r
    .x-item-selected & {\r
        background-color: $grid-cell-selected-background-color;\r
        @include color-by-background($grid-cell-selected-background-color);\r
    }\r
\r
    .x-item-pressed & {\r
        background: $grid-cell-pressed-background-color none;\r
    }\r
\r
    .x-grid-cell-inner {\r
        @include font($grid-cell-font-weight, $grid-cell-font-size, $grid-cell-line-height, $grid-cell-font-family);\r
        padding: $grid-cell-padding;\r
        @if $enable-big {\r
            .x-big & {\r
                font-size: $grid-cell-font-size-big;\r
                line-height: $grid-cell-line-height-big;\r
                padding: $grid-cell-padding-big;\r
            }\r
        }\r
    }\r
\r
    border-bottom: 1px solid $grid-cell-border-color;\r
\r
    .x-button,\r
    .x-field {\r
        margin-top: -(top($grid-cell-padding));\r
        margin-bottom: -(bottom($grid-cell-padding));\r
\r
        @if $enable-big {\r
            .x-big & {\r
                margin-top: -(top($grid-cell-padding-big));\r
                margin-bottom: -(bottom($grid-cell-padding-big));\r
            }\r
        }\r
    }\r
\r
    .x-grid-summaryrow & {\r
        background-color: $grid-summary-row-cell-background-color;\r
        color: $grid-summary-row-cell-color;\r
\r
        .x-grid-cell-inner {\r
            @include font($grid-summary-row-cell-font-weight, $grid-summary-row-cell-font-size, $grid-summary-row-cell-line-height, $grid-summary-row-cell-font-family);\r
            padding: $grid-summary-row-cell-padding;\r
            @if $enable-big {\r
                .x-big & {\r
                    font-size: $grid-summary-row-cell-font-size-big;\r
                    line-height: $grid-summary-row-cell-line-height-big;\r
                    padding: $grid-summary-row-cell-padding-big;\r
                }\r
            }\r
        }\r
    }\r
}\r
\r
.x-grid-header {\r
    background-color: $grid-group-header-background-color;\r
    border-top: 1px solid $grid-group-header-border-color;\r
    border-bottom: 1px solid $grid-group-header-border-color;\r
\r
    color: $grid-group-header-color;\r
    @include font($grid-group-header-font-weight, $grid-group-header-font-size, $grid-group-header-line-height, $grid-group-header-font-family);\r
    padding: $grid-group-header-padding;\r
\r
    @if $enable-big {\r
        .x-big & {\r
            font-size: $grid-group-header-font-size-big;\r
            line-height: $grid-group-header-line-height-big;\r
            padding: $grid-group-header-padding-big;\r
        }\r
    }\r
}\r
\r
\r
.x-grid-viewoptions {\r
    background-color: #fff;\r
    border-color: $sheet-border-color;\r
}\r
\r
.#{$prefix}column-options-sortablehandle,\r
.#{$prefix}column-options-visibleindicator,\r
.#{$prefix}column-options-groupindicator,\r
.#{$prefix}column-options-folder,\r
.#{$prefix}column-options-leaf {\r
    height: 1em;\r
    width: 1em;\r
    font-size: $gridviewoptions-icon-font-size;\r
    @if $enable-big {\r
        .x-big & {\r
            font-size: $gridviewoptions-icon-font-size-big;\r
        }\r
    }\r
}\r
\r
.x-column-options-itemwrap {\r
    @include st-box;\r
    @include st-box-align(center);\r
\r
    > * {\r
        margin-right: .5em;\r
    }\r
\r
    > :last-child {\r
        margin-right: 0;\r
    }\r
}\r
\r
.x-column-options-sortablehandle {\r
    @include font-icon($fa-var-bars FontAwesome);\r
    color: $neutral-dark-color;\r
}\r
\r
.x-column-options-text {\r
    @include st-box-flex;\r
}\r
\r
.x-column-options-visibleindicator {\r
    @include font-icon($fa-var-eye FontAwesome);\r
    color: $base-color;\r
}\r
\r
.x-column-options-groupindicator {\r
    @include font-icon($fa-var-group FontAwesome);\r
    color: $neutral-dark-color;\r
}\r
\r
.x-column-options-folder,\r
.x-column-options-leaf {\r
    color: #91E698;\r
}\r
\r
.x-column-options-folder {\r
    @include font-icon($fa-var-folder FontAwesome);\r
\r
}\r
.x-column-options-leaf {\r
    @include font-icon($fa-var-file FontAwesome);\r
}\r
\r
.x-column-options-hidden {\r
    .x-column-options-visibleindicator,\r
    .x-column-options-text,\r
    .x-column-options-folder,\r
    .x-column-options-leaf {\r
        color: $neutral-dark-color;\r
    }\r
}\r
\r
.x-column-options-grouped .x-column-options-groupindicator {\r
    color: $base-color;\r
}\r
\r
//----------------------------------------------------\r
\r
.#{$prefix}grid-multiselection-column > .x-grid-cell-inner {\r
    position: relative;\r
    padding: 0;\r
\r
    &:after {\r
        display: block;\r
        font-family: FontAwesome;\r
        text-align: center;\r
        content: $fa-var-square-o;\r
\r
        font-size: $grid-cell-font-size;\r
        line-height: $grid-cell-line-height;\r
\r
        .x-big & {\r
            font-size: $grid-cell-font-size-big;\r
            line-height: $grid-cell-line-height-big;\r
        }\r
    }\r
}\r
\r
.#{$prefix}grid-multiselection-cell > .x-grid-cell-inner {\r
    position: relative;\r
    padding: 0;\r
    text-align: center;\r
\r
    &:after {\r
        display: inline-block;\r
        @include font-icon($checkboxfield-checkbox-icon, $pseudo: false);\r
        height: $checkboxfield-checkbox-size;\r
        width: $checkboxfield-checkbox-size;\r
        color: $checkboxfield-checkbox-color;\r
\r
        .#{$prefix}item-selected & {\r
            @include font-icon($checkboxfield-checked-checkbox-icon, $pseudo: false);\r
        }\r
\r
        @if $enable-big {\r
            .x-big & {\r
                font-size: $checkboxfield-checkbox-font-size-big;\r
            }\r
        }\r
    }\r
}\r
\r
.x-grid-multiselection-column {\r
	color: #C0C0C0;\r
\r
    &.x-grid-multiselection-allselected:after {\r
        color: #1464AE !important;\r
    }\r
}\r
\r
.x-grid-multiselection-cell {\r
	color: #C0C0C0;\r
}\r
\r
.x-item-selected .x-grid-multiselection-cell:after {\r
    color: #1464AE;\r
}\r
\r
//----------------------------------------------------\r
\r
.x-grid-pagingtoolbar {\r
    border-top-color: #d7d7d7;\r
}\r
\r
.#{$prefix}grid-pagingtoolbar-prev {\r
    @include font-icon($fa-var-angle-left FontAwesome);\r
}\r
\r
.#{$prefix}grid-pagingtoolbar-next {\r
    @include font-icon($fa-var-angle-right FontAwesome);\r
}\r