add extjs 6.0.1 sources

[extjs.git] / extjs / modern / theme-mountainview / sass / src / dataview / List.scss

/**\r
 * @class Ext.dataview.List\r
 */\r
\r
.x-list {\r
    .x-list-disclosure {\r
        position: relative;\r
        overflow: visible;\r
        background: $base-color;\r
        border: 0;\r
        @include border-radius($list-disclosure-size);\r
        width: $list-disclosure-size;\r
        height: $list-disclosure-size;\r
        margin: 9px 9px 0 0;\r
\r
        &:before {\r
            @include absolute-position(0, 0, 0, 0);\r
            content: '4';\r
            // TODO: Use FontAwesome\r
            font-family: 'Pictos';\r
            color: $background-color;\r
            font-size: 20px;\r
            text-align: center;\r
            line-height: 30px;\r
            padding-left: 2px;\r
        }\r
    }\r
\r
    &.x-list-indexed .x-list-disclosure {\r
        margin-right: 1.8em;\r
    }\r
\r
    .x-item-selected .x-list-disclosure {\r
        background: $background-color none;\r
\r
        &:before {\r
            color: $base-color;\r
        }\r
    }\r
\r
    .x-list-item {\r
        color: $primary-text-color;\r
        font-size: 12pt;\r
\r
        &.x-item-pressed {\r
            &.x-list-item-tpl,\r
            .x-dock-horizontal {\r
                background-color: $base-color;\r
            }\r
        }\r
\r
        &.x-item-selected .x-dock-horizontal,\r
        &.x-item-selected.x-list-item-tpl {\r
            background-color: $base-color;\r
        }\r
\r
				&.x-item-pressed,\r
				&.x-item-selected {\r
					border-color: $base-color !important;\r
				}\r
\r
        .x-list-item-body,\r
        &.x-list-item-tpl .x-innerhtml {\r
            padding: 12px 5px;\r
        }\r
    }\r
    \r
    .x-list-header {\r
        color: $secondary-text-color;\r
        font-size: 12pt;\r
        font-weight: bold;\r
        text-transform: uppercase;\r
        background: transparent;\r
        border: 0;\r
        padding: 15px 5px 5px;\r
        @include box-shadow(0 1px 0 darken($background-color, 6));\r
\r
        &.x-list-item-first {\r
            padding-top: 5px;\r
        }\r
    }\r
\r
    .x-list-item {\r
        &.x-list-item-tpl,\r
        .x-dock-horizontal {\r
            border-top: 1px solid darken($background-color, 3);\r
        }\r
\r
\r
        &.x-list-item-tpl.x-list-footer-wrap,\r
        &.x-list-footer-wrap .x-dock-horizontal {\r
            border-bottom: 1px solid darken($background-color, 3);\r
        }\r
    }\r
}\r
\r
.x-list .x-list-item-odd {\r
    &.x-list-item-tpl,\r
    .x-dock-horizontal {\r
        background-color: darken($background-color, 3);\r
    }\r
}\r
\r
// IndexBar\r
.x-indexbar {\r
    padding: 4px 0;\r
    color: $secondary-text-color;\r
    background: rgba($foreground-color, .2);\r
}