|
|
- /* 主页面背景 */
- .app-main {
- background: #f3f5f8;
- }
-
- /* 侧边菜单栏背景 */
- .sidebar-container .el-scrollbar {
- background: #303030;
- }
-
- /* 导航栏 */
- .navbar {
- background: #fff;
- /* 与tagViews的间隔 */
- border-bottom: 1px solid #f1f1f1;
- /* 收缩图标 */
- >.hamburger-container {
- fill: #5a5e66;
- &:hover {
- background: rgba(0, 0, 0, .05)
- }
- }
- /* 右侧功能区 */
- >.right-menu {
- /* 功能项 */
- >.right-menu-item {
- color: #5a5e66;
- &.hover-effect {
- &:hover {
- background: rgba(0, 0, 0, .05)
- }
- }
- }
- }
- }
-
- /* 打开的菜单视图 */
- .tags-view-container {
- background: #fff;
- >.tags-view-wrapper {
- /* 显示区域 */
- .tags-view-item {
- color: #999;
- border-left: 1px solid #f1f1f1;
- /* 关闭图标 */
- &>.el-icon-close {
- color: #000;
- }
- &:hover {
- color: #495060;
- &>.el-icon-close {
- color: red;
- }
- }
- /* 边框 */
- &:last-of-type {
- border-right: 1px solid #f1f1f1;
- }
- /* 激活项 */
- &.active {
- /* 图标 */
- &::before {
- background: #85ef47!important;
- box-shadow: 0 0 7px #b7eb8f;
- }
- }
- }
- }
- /* 菜单弹出功能区 */
- >.contextmenu {
- background: #fff;
- color: #333;
- box-shadow: 0 2px 12px 0 rgba(0,0,0,0.1);
- /* 功能项 */
- li {
- &:hover {
- background-color: #e8f4ff;
- color: #46a6ff;
- }
- }
- }
- }
-
- /* 功能区背景 */
- .app-container,.content-container {
- background: #fff;
- }
-
- /* 底部商标区 */
- .footer {
- background: #fff;
- color: #606266;
- }
-
- /* 仪表盘 */
- .main {
- /* 访问量块 */
- .todayIp {
- color: #27c6da !important;
- }
- .todayVisit {
- color: #fc573b !important;
- }
- .totalVisit {
- color: #be63f9 !important;
- }
- }
-
- /* 表格 */
- .el-table{
- /* 表头 */
- & thead {
- color: #606266;
- }
- }
-
- /* 树形选择组件 */
- .vue-treeselect__single-value {
- color: #606266 !important;
- }
-
- /* 表格操作图标 */
- .table-operation, .el-icon-{
- &view{
- color: #87d068;
- }
- &unlock{
- color: #87d068;
- }
- &setting {
- color: #2db7f5;
- }
- &delete {
- color: #f50;
- }
- }
-
- /* 头部导航栏一级菜单 */
- .head-menu-container {
- /* 显示区域 */
- .el-submenu__title {
- /* 图标 */
- i {
- color: #909399;
- }
- &:active {
- color:#000 !important;
- }
- &:hover {
- background-color: #f0f0f0 !important;
- }
- }
- /* 激活项 */
- .el-submenu.is-active .el-submenu__title {
- color: #000 !important;
- }
- }
-
- /* 头部导航栏子菜单 */
- .el-menu--horizontal {
- /* 头部导航栏子菜单 */
- >.el-menu {
- background: #fff !important;
- }
- .headMenu-wrapper {
- /* 显示区域 */
- .el-menu-item, .el-submenu__title {
- color: #909399;
- background-color: white;
- /* 激活项 */
- &.is-active {
- color:#000 !important;
- background-color: #f0f0f0 !important;
- }
- &:hover {
- background-color: #f0f0f0 !important;
- }
- }
- }
- }
|