smart-power-ui/src/assets/styles/theme.scss

//theme-green主题
.theme-green{
  //logo
  .sidebar-logo-container{
    background: $menuGreenLogoBg !important;
  }
  .sidebar-title{
    color: $menuGreenLogoColor !important;
  }

  .sidebar-container{
    background-color: $menuGreenBg !important;

    .el-submenu>.el-submenu__title{
      background-color: $menuGreenBg !important;
      color: $sidebarGreenTitle !important;
      &:hover{
        background: $menuGreenActiveHover !important;
      }
    }
    .el-menu,.el-menu-item{
      background-color: $menuGreenBg !important;
      color: $sidebarGreenTitle !important;
      &:hover{
        background: $menuGreenActiveHover !important;
      }

    }
    .el-submenu.is-active>.el-submenu__title,.el-submenu.is-active .el-menu-item{
      background-color: $menuGreenLogoBg !important;
    }
    .el-submenu.is-active>.el-submenu__title{
      background-color: $menuGreenActive !important;
      color: $menuGreenActiveTxt !important;
    }
    .el-submenu.is-active .el-menu-item.is-active{
      background: $menuGreenActive !important;
      color: $menuGreenActiveTxt !important;
    }
  }
  .router-link-active>.is-active{
    color: $menuGreenActiveTxt !important;
    background: $menuGreenActive !important;
  }
  //右上角颜色
  .right-menu-item{
    color: $menuGreenBg !important;
  }
  //tag样式
  .tags-view-container .tags-view-wrapper .tags-view-item.active{
    background-color: $menuGreenBg !important;
  }
}


//theme-blue-black主题
.theme-blue-black{
  //logo
  .sidebar-logo-container{
    background: $menuBlueBlackLogoBg !important;
  }
  .sidebar-title{
    color: $menuBlueBlackLogoColor !important;
  }

  .sidebar-container{
    background-color: $menuBlueBlackBg !important;
    .el-submenu>.el-submenu__title{
      background-color: $menuBlueBlackBg !important;
      color: $sidebarBlueBlackTitle !important;
      &:hover{
        color: $menuBlueBlackLogoColor !important;
        background: $menuBlueBlackActiveHover !important;
      }
    }
    .el-menu,.el-menu-item{
      background-color: $menuBlueBlackBg !important;
      color: $sidebarBlueBlackTitle !important;
      &:hover{
        color: $menuBlueBlackLogoColor !important;
        background: $menuBlueBlackActiveHover !important;
      }
    }
    .el-submenu.is-active>.el-submenu__title,.el-submenu.is-active .el-menu-item{
      background-color: $menuBlueBlackActiveBg !important;
    }
    .el-submenu.is-active>.el-submenu__title{
      color: $menuBlueBlackLogoColor !important;
    }
    .el-submenu.is-active .el-menu-item.is-active{
        color: $menuBlueBlackLogoColor !important;
        background: $menuBlueBlackActive !important;
    }
  }
  .router-link-active>.is-active{
    color: $menuBlueBlackLogoColor !important;
    background: $menuBlueBlackActive !important;
  }
  //右上角颜色
  .right-menu-item{
    color: $menuBlueBlackLogoColor !important;
  }
  //tag样式
  .tags-view-container .tags-view-wrapper .tags-view-item.active{
    background-color: $menuBlueBlackLogoColor !important;
  }
}

//theme-blue-white主题
.theme-blue-white{
  //logo
  .sidebar-logo-container{
    background: $menuBlueWhiteLogoBg !important;
  }
  .sidebar-title{
    color: $menuBlueWhiteLogoColor !important;
  }

  .sidebar-container{
    background-color: $menuBlueWhiteBg !important;
    .el-submenu>.el-submenu__title{
      background-color: $menuBlueWhiteBg !important;
      .svg-icon{
        color: $sidebarBlueWhiteTitle !important;
      }
      //color: $sidebarBlueWhiteTitle !important;
      &:hover{
        color: $menuBlueWhiteBg !important;
        background: $menuBlueWhiteActiveHover !important;
        .svg-icon{
          color: $menuBlueWhiteBg !important;
        }
      }
    }
    .el-menu,.el-menu-item{
      background-color: $menuBlueWhiteBg !important;
      .svg-icon{
        color: $sidebarBlueWhiteTitle !important;
      }
      &:hover{
        color: $menuBlueWhiteBg !important;
        background: $menuBlueWhiteActiveHover !important;
        //.svg-icon{
        //  color: $menuBlueWhiteText !important;
        //}
      }
    }
    .el-menu-item{
      &:hover{
        .svg-icon{
          color: $menuBlueWhiteText !important;
        }
      }
    }

    .el-submenu.is-active .el-submenu__title{
      color: $menuBlueWhiteBg !important;
      background: $menuBlueWhiteHover !important;
      .svg-icon{
        color: $menuBlueWhiteText !important;
      }
    }
    .el-submenu.is-active .el-menu-item.is-active{
      color: $menuBlueWhiteBg !important;
      background: $menuBlueWhiteHover !important;
      .svg-icon{
        color: $menuBlueWhiteText !important;
      }
    }

  }
  .router-link-active>.is-active{
    color: $menuBlueWhiteBg !important;
    background: $menuBlueWhiteHover !important;
    .svg-icon{
      color: $menuBlueWhiteText !important;
    }
  }
  //右上角颜色
  .right-menu-item{
    color: $menuBlueWhiteLogoColor !important;
  }
  //tag样式
  .tags-view-container .tags-view-wrapper .tags-view-item.active{
    background-color: $menuBlueWhiteLogoColor !important;
  }
}