1
0
mirror of https://github.com/zclzone/vue-naive-admin.git synced 2025-06-16 20:19:00 +08:00

style: 修改菜单选中样式

This commit is contained in:
zclzone 2024-05-10 16:51:14 +08:00
parent 4eb15744a6
commit e73c138892
2 changed files with 9 additions and 14 deletions

View File

@ -59,19 +59,14 @@ function handleMenuSelect(key, item) {
</script>
<style lang="scss">
.side-menu {
.n-menu-item-content__icon {
border: 1px solid rgb(229, 231, 235);
border-radius: 4px;
}
.n-menu-item-content--child-active,
.n-menu-item-content--selected {
.n-menu-item-content__icon {
border-color: var(--primary-color);
background-color: var(--primary-color);
i {
color: #fff;
.side-menu:not(.n-menu--collapsed) {
.n-menu-item-content {
&::before {
left: 8px;
right: 8px;
}
&.n-menu-item-content--selected::before {
border-left: 4px solid var(--primary-color);
}
}
}

View File

@ -34,7 +34,7 @@ export const usePermissionStore = defineStore('permission', {
key: route.name,
path: route.path,
originPath: route.meta.originPath,
icon: () => h('i', { class: `${route.meta.icon} text-14` }),
icon: () => h('i', { class: `${route.meta.icon} text-16` }),
order: item.order ?? 0,
}
const children = item.children?.filter((item) => item.type === 'MENU') || []