.operateBtnIcon{
    display: inline-flex;
    width: 24px;
    height: 24px;
    cursor: pointer;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 12px;

    user-select: none;
    @include themeColor("background-color",'color');
    &:hover{
        // background: #419cf1;
        @include themeColor("background-color",'hover');
    }
    &:active{
        // background: #1174d1;
        @include themeColor("background-color",'active');
    }
    &.disabled{
        cursor: no-drop;
        @include themeColor("background-color",'color');
        opacity: 0.3;
    }

    &.small{
        width: 28px;
        height: 28px;
        font-size: 14px;
    }
    &.mini{
        width: 24px;
        height: 24px;
        font-size: 12px;
    }

    &.hong{
        background: #ec5b56;
        user-select: none;
        &:hover{
            background: #e87773;
        }
        &:active{
            background: #ce4b46;
        }
        &.disabled{
            cursor: no-drop;
            background: #f5adaa;
        }
    }
    &.huang{
        background: #f3a531;
        user-select: none;
        &:hover{
            background: #f2b354;
        }
        &:active{
            background: #d38d24;
        }
        &.disabled{
            cursor: no-drop;
            background: #f7deb9;
        }
    }
    &.lv{
        background: #52c41a;
        user-select: none;
        &:hover{
            background: #95de64;
        }
        &:active{
            background: #52c41a;
        }
        &.disabled{
            cursor: no-drop;
            background: #52c41a;
            opacity: 0.3;
        }
    }
    &.hui{
        background: #ccc;
        user-select: none;
        &:hover{
            background: #dddddd;
        }
        &:active{
            background: #ccc;
        }
        &.disabled{
            cursor: no-drop;
            background: #c1c1c1;
            opacity: 0.3;
        }
    }
    
}
.operateBtnIconPopper.is-light{
    border: none;
    box-shadow: 0 0 6px 0px rgba($color: #cfd0d3, $alpha: 1);
}
.operateBtnIconPopper[x-placement^=bottom] .popper__arrow{
    border: none;
}
.operateBtnIconPopper[x-placement^=bottom]{
    margin-top: 5px;
}
.operateBtnIconPopper{
    padding: 5px 10px;
}