acud/es/tabs/style/dropdown.less

acg react 组件库

@import '../../style/themes/index';
@import '../../style/mixins/index';
@import './index';

@text-color: fade(#000, 85%);
@item-hover-bg: #f5f5f5;
//Dropdown
@dropdown-menu-bg: @component-background;
@dropdown-vertical-padding: 5px;
@dropdown-edge-child-vertical-padding: 4px;
@dropdown-font-size: @tabs-font-size-base;
@dropdown-line-height: 22px;

.@{tab-prefix-cls}-dropdown {
    .reset-component();

    position: absolute;
    top: -9999px;
    left: -9999px;
    z-index: @zindex-dropdown;
    display: block;

    &-hidden {
        display: none;
    }

    &-menu {
        max-height: 200px;
        margin: 0;
        padding: @dropdown-edge-child-vertical-padding 0;
        overflow-x: hidden;
        overflow-y: auto;
        text-align: left;
        list-style-type: none;
        background-color: @dropdown-menu-bg;
        background-clip: padding-box;
        border-radius: @border-radius-base;
        outline: none;
        box-shadow: @tabs-box-shadow-base;

        &-item {
            min-width: 120px;
            margin: 0;
            padding: @dropdown-vertical-padding @control-padding-horizontal;
            overflow: hidden;
            color: @text-color;
            font-weight: normal;
            font-size: @dropdown-font-size;
            line-height: @dropdown-line-height;
            white-space: nowrap;
            text-overflow: ellipsis;
            cursor: pointer;
            transition: all 0.3s;

            &:hover {
                background: @item-hover-bg;
            }

            &-disabled {

                &,
                &:hover {
                    color: @disabled-color;
                    background: transparent;
                    cursor: not-allowed;
                }
            }
        }
    }
}