magiccube-vue3/package/style/select.less

vue3-js版组件库

@import './theme';
@import './picker-common';

.mc-select {
    .mc-picker-common-picker();

    &__result {
        .mc-picker-common-result-panel();

        &--wrap {
            .mc-picker-common-result-tag-wrap()
        }

        &--name {
            .mc-picker-common-result-tag-name()
        }

        &--close {
            .mc-picker-common-result-tag-close()
        }

        &--amount {
            .mc-picker-common-result-tag-amount()
        }

        &--placeholder {
            .mc-picker-common-result-tag-placeholder()
        }

        &--keyword{
            .mc-picker-common-result-tag-keyword()
        }

        &--arrow{
            .mc-picker-common-result-arrow()
        }

        &--single{
            .mc-pciker-common-result-single();
            padding-right: 12px;
        }
    }

    &.disabled{
        .mc-select__result{
            .mc-picker-common-picker-disabled();
        }
    }
}


.mc-select-dropdown {
    .mc-picker-common-dropdown-wrap();

    &__toolbar {
        display: flex;
        align-items: center;
        padding: 0 16px;
        height: 32px;
        color: @color-font-sub;
    }

    &__list {
        .mc-picker-common-dropdown-list();
    }

    &__footer{
        padding: 8px 16px;
        text-align: center;
    }

    &__empty{
        padding: 4px;
        text-align: center;
        font-size: var(--mc-small-size);
        color: var(--mc-subtitle-color);
    }
}