diff --git a/src/layouts/LeftMode.vue b/src/layouts/LeftMode.vue index 9f14c41..5b6d054 100644 --- a/src/layouts/LeftMode.vue +++ b/src/layouts/LeftMode.vue @@ -76,6 +76,7 @@ $transition-time: 0.35s; left: 0; z-index: 1001; overflow: hidden; + border-right: var(--v3-sidebar-border-right); } .main-container { diff --git a/src/layouts/LeftTopMode.vue b/src/layouts/LeftTopMode.vue index 9bb0f04..bf235cc 100644 --- a/src/layouts/LeftTopMode.vue +++ b/src/layouts/LeftTopMode.vue @@ -79,6 +79,7 @@ $transition-time: 0.35s; left: 0; z-index: 1001; overflow: hidden; + border-right: var(--v3-sidebar-border-right); padding-top: var(--v3-navigationbar-height); } diff --git a/src/styles/theme/core/element-plus.scss b/src/styles/theme/core/element-plus.scss index 44f0de8..2c3db6e 100644 --- a/src/styles/theme/core/element-plus.scss +++ b/src/styles/theme/core/element-plus.scss @@ -2,24 +2,23 @@ // 侧边栏的 item 的 popper .el-popper { - border: none !important; .el-menu { - background-color: lighten($theme-bg-color, 2%) !important; + background-color: var(--el-bg-color); .el-menu-item { - background-color: lighten($theme-bg-color, 2%) !important; + background-color: var(--el-bg-color); &.is-active, &:hover { - background-color: lighten($theme-bg-color, 6%) !important; - color: $active-font-color !important; + background-color: var(--el-bg-color-overlay); + color: #ffffff; } } .el-sub-menu__title { - background-color: lighten($theme-bg-color, 2%) !important; + background-color: var(--el-bg-color); } .el-sub-menu { &.is-active { > .el-sub-menu__title { - color: $active-font-color !important; + color: #ffffff; } } } diff --git a/src/styles/theme/core/layouts.scss b/src/styles/theme/core/layouts.scss index c8df399..62dcfe3 100644 --- a/src/styles/theme/core/layouts.scss +++ b/src/styles/theme/core/layouts.scss @@ -3,25 +3,25 @@ .app-wrapper { // 侧边栏 .sidebar-container { - background-color: lighten($theme-bg-color, 2%); + background-color: var(--el-bg-color); .el-menu { - background-color: lighten($theme-bg-color, 2%) !important; + background-color: var(--el-bg-color); .el-menu-item { - background-color: lighten($theme-bg-color, 2%) !important; + background-color: var(--el-bg-color); &.is-active, &:hover { - background-color: lighten($theme-bg-color, 6%) !important; - color: $active-font-color !important; + background-color: var(--el-bg-color-overlay); + color: #ffffff; } } } .el-sub-menu__title { - background-color: lighten($theme-bg-color, 2%) !important; + background-color: var(--el-bg-color); } .el-sub-menu { &.is-active { > .el-sub-menu__title { - color: $active-font-color !important; + color: #ffffff !important; } } } diff --git a/src/styles/theme/dark-blue/variables.scss b/src/styles/theme/dark-blue/variables.scss index 2add393..4fa3b6d 100644 --- a/src/styles/theme/dark-blue/variables.scss +++ b/src/styles/theme/dark-blue/variables.scss @@ -4,5 +4,3 @@ $theme-name: "dark-blue"; // 主题背景颜色 $theme-bg-color: #001b44; -// active 状态下文字颜色 -$active-font-color: #ffffff; diff --git a/src/styles/theme/dark/variables.scss b/src/styles/theme/dark/variables.scss index 312cb3d..e8f4020 100644 --- a/src/styles/theme/dark/variables.scss +++ b/src/styles/theme/dark/variables.scss @@ -4,5 +4,3 @@ $theme-name: "dark"; // 主题背景颜色 $theme-bg-color: #141414; -// active 状态下文字颜色 -$active-font-color: #ffffff; diff --git a/src/styles/variables.css b/src/styles/variables.css index 3dc7942..d97caca 100644 --- a/src/styles/variables.css +++ b/src/styles/variables.css @@ -15,6 +15,7 @@ /** Sidebar 组件(左侧模式全部生效、顶部模式全部不生效、混合模式非颜色部分生效) */ --v3-sidebar-width: 220px; --v3-sidebar-hide-width: 58px; + --v3-sidebar-border-right: 1px solid var(--el-fill-color); --v3-sidebar-menu-item-height: 60px; --v3-sidebar-menu-tip-line-bg-color: var(--el-color-primary); --v3-sidebar-menu-bg-color: #001428; diff --git a/src/styles/vxe-table.css b/src/styles/vxe-table.css index 8b9766f..13bd1d4 100644 --- a/src/styles/vxe-table.css +++ b/src/styles/vxe-table.css @@ -46,7 +46,7 @@ /*table*/ --vxe-table-header-font-color: var(--el-text-color-regular); --vxe-table-footer-font-color: var(--el-text-color-regular); - --vxe-table-border-color: var(--el-border-color); + --vxe-table-border-color: var(--el-border-color-lighter); --vxe-table-header-background-color: var(--el-bg-color); --vxe-table-body-background-color: var(--el-bg-color); --vxe-table-footer-background-color: var(--el-bg-color); @@ -70,7 +70,7 @@ /*toolbar*/ --vxe-toolbar-background-color: var(--el-bg-color); --vxe-toolbar-custom-active-background-color: var(--el-bg-color-overlay); - --vxe-toolbar-panel-background-color: var(--el-bg-color); + --vxe-toolbar-panel-background-color: var(--el-bg-color-overlay); /*pager*/ --vxe-pager-background-color: var(--el-bg-color); diff --git a/src/views/table/element-plus/index.vue b/src/views/table/element-plus/index.vue index 6ab8ce8..1e3f819 100644 --- a/src/views/table/element-plus/index.vue +++ b/src/views/table/element-plus/index.vue @@ -148,7 +148,7 @@ watch([() => paginationData.currentPage, () => paginationData.pageSize], getTabl diff --git a/src/views/table/vxe-table/tsx/RoleColumnSolts.tsx b/src/views/table/vxe-table/tsx/RoleColumnSolts.tsx index 708b8a6..9d95f94 100644 --- a/src/views/table/vxe-table/tsx/RoleColumnSolts.tsx +++ b/src/views/table/vxe-table/tsx/RoleColumnSolts.tsx @@ -3,7 +3,7 @@ import { type VxeColumnPropTypes } from "vxe-table/types/column" const solts: VxeColumnPropTypes.Slots = { default: ({ row, column }) => { const cellValue = row[column.field] - const type = cellValue === "admin" ? "" : "warning" + const type = cellValue === "admin" ? "primary" : "warning" return [{cellValue}] } }