@import "./_themes.scss";
//遍历主题map
@mixin themeify {
    @each $theme-name, $theme-map in $themes {
        //!global 把局部变量强升为全局变量
        $theme-map: $theme-map !global;
        //判断html的data-theme的属性值  #{}是sass的插值表达式
        //& sass嵌套里的父容器标识   @content是混合器插槽，像vue的slot
        [color-theme="#{$theme-name}"] & {
            @content;
        }
    }
}

//声明一个根据Key获取颜色的function
@function themed($key) {
    @return map-get($theme-map, $key);
}

//获取主框架背景颜色
@mixin bg($color) {
    @include themeify {
        background-color: themed($color);
    }
}

@mixin _bg($color) {
    @include themeify {
        background-color: themed($color) !important;
    }
}

//获取主框架背景颜色
@mixin bgl($color) {
    @include themeify {
        background-image: themed($color);
    }
}

@mixin _bgl($color) {
    @include themeify {
        background-image: themed($color) !important;
    }
}

//获取主框架背景颜色
@mixin bgi($path) {
    @include themeify {
        background-image: themed($path);
    }
}

//获取主框架字体颜色
@mixin txt($color) {
    @include themeify {
        color: themed($color);
    }
}

@mixin _txt($color) {
    @include themeify {
        color: themed($color) !important;
    }
}

//获取主框架边框颜色
@mixin bd($color,$p:null) {
    @include themeify {
        @if $p==null {
            border-color: themed($color);
        }
        @if $p=='l' {
            border-left-color: themed($color);
        }
        @if $p=='r' {
            border-right-color: themed($color);
        }
        @if $p=='t' {
            border-top-color: themed($color);
        }
        @if $p=='b' {
            border-bottom-color: themed($color);
        }
    }
}

//获取主框架边框颜色
@mixin _bd($color,$p:null) {
    @include themeify {
        @if $p==null {
            border-color: themed($color) !important;
        }
        @if $p=='l' {
            border-left-color: themed($color) !important;
        }
        @if $p=='r' {
            border-right-color: themed($color) !important;
        }
        @if $p=='t' {
            border-top-color: themed($color) !important;
        }
        @if $p=='b' {
            border-bottom-color: themed($color) !important;
        }
    }
}
//设置outline
@mixin ol($color) {
    @include themeify {
        outline:1px solid themed($color);
    }
}
//设置表格的边线
@mixin linear($color){
    @include themeify {
        background-image: linear-gradient(themed($color),themed($color)),linear-gradient(themed($color),themed($color));
    }
}
@import './style1.scss';
@import './style2.scss';
@import './style3.scss';

//菜单1
.menu-one{
    .mune-base ul{
        background-color: #f2f2f2 !important;
        .el-submenu__title,
        .el-menu-item{
            height:42px;
            line-height: 41px;
            i{
                @include txt("textColor1");
            }
            span{
                @include txt("textColor1");
            }
        }
    }
    >ul{
        text-align: left;
        .el-submenu__title,
        .el-menu-item{
            height:42px;
            line-height: 41px;
            i{
                @include txt("iconColor");
            }
            span{
                @include txt("textColor");
            }
        }
        .el-submenu__title{
            border:none !important;
            padding-left: 10px;
            padding-right: 0;
            span{
                @include size(150px,auto,$dp:inline-block,$ag:left);
                @extend .text-oneline;
                padding-right:15px;
            }
        }
        .el-menu-item {
            padding-left: 10px;
            padding-right: 10px;
            span{
                @include size(220px,auto,$dp:inline-block,$ag:left);
                @extend .text-oneline;
            }
        }
        .el-menu--collapse>.el-submenu>.el-submenu__title .el-submenu__icon-arrow{
            display: inline-block;
            right:10px !important;
        }
    }
    .el-menu.el-menu--horizontal{
        border:none;
    }
    .el-menu-item.is-active{
        @include _bg('bgColor6');
        span,i{
            @include _txt('textColor');
        }
    }
}
//菜单移入效果
.el-menu-item:hover,
.el-submenu__title:hover{
    @include _bg('bgColor6');
    span,i{
        @include _txt('textColor');
    }
}
//加载条颜色
#nprogress .bar {
    background: rgb(175, 111, 28) !important; //自定义颜色
}
//文字提示容器取消outline
.el-tooltip{
    outline: none;
}

@for $i from 0 through 4 {
    .level#{$i}{
        font-size: (15px - $i);
        margin-left:6px;
    }
}

@mixin theme(){
    [data-theme="primary1"]{
    };
    [data-theme="primary2"]{
    };
    [data-theme="primary3"]{
        @extend .breadcrumb-jt;
    };
}