rabbit-simple-ui/src/styles/mixins/select.less

A simple UI component library based on JavaScript

.select-item(@size-class, @item-tag , @item-class) {
    @{item-tag} {
        display: block;
        margin: 0;
        line-height: normal;
        padding: 7px 16px;
        clear: both;
        color: @text-color;
        font-size: @font-size-base !important;
        white-space: nowrap;
        cursor: pointer;
        transition: all 0.3s @ease-in-out;

        &:hover {
            background: @background-color-select-hover;
        }

        &[disabled] {
            color: @btn-disable-color;
            cursor: @cursor-disabled;

            &:hover {
                color: @btn-disable-color;
                background-color: #fff;
                cursor: @cursor-disabled;
            }
        }

        &[selected],
        &[selected]:hover {
            color: @primary-color;
            background: fade(@selected-color, 10%);
        }

        &[selected].@{item-class}-focus {
            background: shade(@selected-color, 10%);
        }

        &[divided] {
            margin-top: 5px;
            border-top: 1px solid @border-color-split;

            &:before {
                content: '';
                height: 5px;
                display: block;
                margin: 0 -16px;
                background-color: #fff;
                position: relative;
                top: -7px;
            }
        }
    }

    .@{item-class} {
        &-focus {
            background: @background-color-select-hover;
        }

        &-enter {
            color: @primary-color;
            font-weight: bold;
            float: right;
        }
    }

    .@{size-class}-large @{item-tag} {
        padding: 7px 16px 8px;
        font-size: @font-size-base !important;
    }

    // http://browserhacks.com/
    // https://bugzilla.mozilla.org/show_bug.cgi?id=488725
    // fixed #1224 #1143 #1127
    @-moz-document url-prefix() {
        @{item-tag} {
            white-space: normal;
        }
    }
}