github_mirrors/vue-vben-admin
1
0
Fork 0
mirror of https://github.com/vbenjs/vue-vben-admin.git synced 2025-01-24 10:33:50 +08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

feat(menu): Restore side bar settings and added menu mouse move in mode light style (#3295)

Browse Source 
* feat(menu):  Added menu mouse move in style

* feat: 恢复菜单主题设置

* type(setting): change the function name to a more appropriate one

---------

Co-authored-by: invalid w <wangjuesix@gmail.com>
This commit is contained in:
zhang 2023-11-18 16:04:52 +08:00 committed by GitHub
parent 35751068c5
commit 003a951bef
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 34 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/SimpleMenu/src/components/menu.less
View File

@ -161,9 +161,9 @@
white-space: nowrap; white-space: nowrap;
cursor: pointer; cursor: pointer;
&:hover { // &:hover {
color: @primary-color; // color: @primary-color;
} // }
.@{menu-prefix-cls}-tooltip { .@{menu-prefix-cls}-tooltip {
width: calc(100% - 0px); width: calc(100% - 0px);
@ -226,6 +226,16 @@
&-active.@{menu-prefix-cls}-submenu { &-active.@{menu-prefix-cls}-submenu {
color: @primary-color; color: @primary-color;
} }
&:not(&-selected):hover {
background-color: rgb(0 0 0 / 6%);
}
}
&-light&-vertical &-submenu-title {
&:not(&-selected):hover {
background-color: rgb(0 0 0 / 6%);
}
} }
&-light&-vertical&-collapse { &-light&-vertical&-collapse {

27
src/layouts/default/setting/SettingDrawer.tsx
View File

@ -3,7 +3,7 @@ import { BasicDrawer } from '/@/components/Drawer/index';
import { Divider } from 'ant-design-vue'; import { Divider } from 'ant-design-vue';
import { import {
TypePicker, TypePicker,
// ThemeColorPicker, ThemeColorPicker,
SettingFooter, SettingFooter,
SwitchItem, SwitchItem,
SelectItem, SelectItem,
@ -38,6 +38,7 @@ import {
// SIDE_BAR_BG_COLOR_LIST, // SIDE_BAR_BG_COLOR_LIST,
// APP_PRESET_COLOR_LIST, // APP_PRESET_COLOR_LIST,
// } from '/@/settings/designSetting'; // } from '/@/settings/designSetting';
import { SIDE_BAR_BG_COLOR_LIST } from '/@/settings/designSetting';
const { t } = useI18n(); const { t } = useI18n();
@ -73,7 +74,7 @@ export default defineComponent({
getTopMenuAlign, getTopMenuAlign,
getAccordion, getAccordion,
getMenuWidth, getMenuWidth,
// getMenuBgColor, getMenuBgColor,
getIsTopMenu, getIsTopMenu,
getSplit, getSplit,
getIsMixSidebar, getIsMixSidebar,
@ -124,15 +125,15 @@ export default defineComponent({
// ); // );
// } // }
// function renderSiderTheme() { function renderSideBarTheme() {
// return ( return (
// <ThemeColorPicker <ThemeColorPicker
// colorList={SIDE_BAR_BG_COLOR_LIST} colorList={SIDE_BAR_BG_COLOR_LIST}
// def={unref(getMenuBgColor)} def={unref(getMenuBgColor)}
// event={HandlerEnum.MENU_THEME} event={HandlerEnum.MENU_THEME}
// /> />
// ); );
// } }
// function renderMainTheme() { // function renderMainTheme() {
// return ( // return (
@ -417,9 +418,9 @@ export default defineComponent({
{/* <Divider>{() => t('layout.setting.sysTheme')}</Divider> {/* <Divider>{() => t('layout.setting.sysTheme')}</Divider>
{renderMainTheme()} {renderMainTheme()}
<Divider>{() => t('layout.setting.headerTheme')}</Divider> <Divider>{() => t('layout.setting.headerTheme')}</Divider>
{renderHeaderTheme()} {renderHeaderTheme()} */}
<Divider>{() => t('layout.setting.sidebarTheme')}</Divider> <Divider>{() => t('layout.setting.sidebarTheme')}</Divider>
{renderSiderTheme()} */} {renderSideBarTheme()}
<Divider>{() => t('layout.setting.interfaceFunction')}</Divider> <Divider>{() => t('layout.setting.interfaceFunction')}</Divider>
{renderFeatures()} {renderFeatures()}
<Divider>{() => t('layout.setting.interfaceDisplay')}</Divider> <Divider>{() => t('layout.setting.interfaceDisplay')}</Divider>

10
src/layouts/default/sider/MixSider.vue
View File

@ -402,6 +402,10 @@
background-color: unset; background-color: unset;
color: @primary-color; color: @primary-color;
} }
&:not(&--active):hover {
background-color: rgb(0 0 0 / 6%);
}
} }
} }
.@{prefix-cls}-menu-list { .@{prefix-cls}-menu-list {
@ -424,9 +428,9 @@
&.dark { &.dark {
&.open { &.open {
.@{prefix-cls}-logo { // .@{prefix-cls}-logo {
// border-bottom: 1px solid @border-color; // border-bottom: 1px solid @border-color;
} // }
> .scrollbar { > .scrollbar {
border-right: 1px solid @border-color; border-right: 1px solid @border-color;