|
|
@ -12,7 +12,7 @@ |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
|
<!-- 顶部菜单超出数量折叠 --> |
|
|
|
<!-- 顶部菜单超出数量折叠 --> |
|
|
|
<el-submenu index="more" v-if="topMenus.length > visibleNumber"> |
|
|
|
<el-submenu :style="{'--theme': theme}" index="more" v-if="topMenus.length > visibleNumber"> |
|
|
|
<template slot="title">更多菜单</template> |
|
|
|
<template slot="title">更多菜单</template> |
|
|
|
<template v-for="(item, index) in topMenus"> |
|
|
|
<template v-for="(item, index) in topMenus"> |
|
|
|
<el-menu-item |
|
|
|
<el-menu-item |
|
|
@ -169,25 +169,27 @@ export default { |
|
|
|
</script> |
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
|
|
<style lang="scss"> |
|
|
|
<style lang="scss"> |
|
|
|
.el-menu--horizontal > .el-menu-item { |
|
|
|
.topmenu-container.el-menu--horizontal > .el-menu-item { |
|
|
|
float: left; |
|
|
|
float: left; |
|
|
|
height: 50px; |
|
|
|
height: 50px !important; |
|
|
|
line-height: 50px; |
|
|
|
line-height: 50px !important; |
|
|
|
margin: 0; |
|
|
|
color: #999093 !important; |
|
|
|
border-bottom: 3px solid transparent; |
|
|
|
padding: 0 5px !important; |
|
|
|
color: #999093; |
|
|
|
margin: 0 10px !important; |
|
|
|
padding: 0 5px; |
|
|
|
|
|
|
|
margin: 0 10px; |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.el-menu--horizontal > .el-menu-item.is-active { |
|
|
|
.topmenu-container.el-menu--horizontal > .el-menu-item.is-active, .el-menu--horizontal > .el-submenu.is-active .el-submenu__title { |
|
|
|
border-bottom: 3px solid #{'var(--theme)'}; |
|
|
|
border-bottom: 2px solid #{'var(--theme)'} !important; |
|
|
|
color: #303133; |
|
|
|
color: #303133; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/* submenu item */ |
|
|
|
/* submenu item */ |
|
|
|
.el-menu--horizontal > .el-submenu .el-submenu__title { |
|
|
|
.topmenu-container.el-menu--horizontal > .el-submenu .el-submenu__title { |
|
|
|
|
|
|
|
float: left; |
|
|
|
height: 50px !important; |
|
|
|
height: 50px !important; |
|
|
|
line-height: 50px !important; |
|
|
|
line-height: 50px !important; |
|
|
|
|
|
|
|
color: #999093 !important; |
|
|
|
|
|
|
|
padding: 0 5px !important; |
|
|
|
|
|
|
|
margin: 0 10px !important; |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |
|
|
|
</style> |
|
|
|