$theme_font_size: .8vw; // 主题字体
$color: #02DEFA !important;

// 循环遍历
$arrColor: #00d3d3,
#ab4fd3,
#e5b007,
#7692ef,
#00b06d,
#0d6fe9,
#FFC0CB,
#DB7093;


@mixin list {
    @each $index in $arrColor {
        $i: index($arrColor, $index);

        &:nth-child(#{$i}) {
            color: nth($arrColor, $i)
        }
    }
}


// 滚动条
@mixin scrollbar {
    cursor: pointer;

    

    &::-webkit-scrollbar {
        width: .3vw;
        height: 5px;
    }

    &::-webkit-scrollbar-thumb {
        border-radius: 10px;
        background: #02DEFA;
        margin-right: 10px;

        &:hover {
            background-color: #02DEFA;
        }

    }

    &::-webkit-scrollbar-track {
        border-radius: 10px;
        background: rgba(255, 255, 255, 0.1);
        margin-right: 10px;
    }
}


// 标题
@mixin title {
    display: flex;
    align-items: center;
    color: #fff;
    padding-top: 15px;
    height: 2.5vw;
    font-size: 1vw;
    font-weight: 700;
    color: $color;
}

// 块
@mixin _black {
    height: 32.5%;
    padding-left: 15px;
    padding-right: 15px;
    background-size: 100% 100%;
    background-image: url('~@/assets/images/bg.png');

    .charts-div {
        position: relative;
        width: 100%;
        height: calc(100% - 2.5vw);
    }
}

// 布局
@mixin layout_flex {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}