@import './var.scss';
@import './mixin.scss';

/*chrome下滚动条样式*/
::-webkit-scrollbar-track-piece { width: 8px; background-color: #f5f5f5; border-radius: 6px; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { height: 50px; background: #bec7d5; border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: #91a0b5; }
html,body{
    display: block;
    height: 100%;
    font-size:14px;
    color:#333;
    margin: 0;
    padding: 0;
}
.#{$css-prefix}-cl{
    @include clearfix;
}
.#{$css-prefix}-fl{
    float: left;
}
.#{$css-prefix}-fr{
    float: right;
}

.#{$css-prefix}-btn {
    background: #fff;
    border: 1px #ccc solid;
    padding: 8px 20px;
    display: inline-block;
    color:#666;
    cursor: pointer;
    +.p-btn{
        margin-left:5px;
    }
    &:hover{
        background:#efefef;
    }
}
.#{$css-prefix}-btn-primary{
    border-color:$--color-primary;
    background-color:$--color-primary;
    color:#fff;
    &:hover{
        background:#1f85ec;
    }
}
.#{$css-prefix}-btn-round{
    border-radius: 500px;
}
.#{$css-prefix}-field{
    display: flex;
    >.#{$css-prefix}-field-lb{
        height: 35px;
        line-height: 35px;
        padding: 0 10px;
    }
    >.#{$css-prefix}-field-val{
        flex: 1;
        height: 35px;
        line-height: 35px;
    }
}
.#{$css-prefix}-field-text{
    display: block;
    border:1px #ddd solid;
    outline: 0;
    border-radius: 5px;
    height: 35px;
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.03);
    box-sizing: border-box;
    padding: 5px;
    width: 100%;
}

.v-enter,
.v-leave-to{
    opacity: 0;
}
.v-enter-active,
.v-leave-active{
    transition: all 0.4s ease;
}