|
@ -48,7 +48,7 @@ export default defineComponent({ |
|
|
<ElMenu |
|
|
<ElMenu |
|
|
id={`${variables.namespace}-tool-header`} |
|
|
id={`${variables.namespace}-tool-header`} |
|
|
popperOffset={16} |
|
|
popperOffset={16} |
|
|
class={[ |
|
|
class={['categoryheader', |
|
|
prefixCls, |
|
|
prefixCls, |
|
|
'h-[var(--top-category-height)] relative px-[var(--top-tool-p-x)] flex items-center justify-between', |
|
|
'h-[var(--top-category-height)] relative px-[var(--top-tool-p-x)] flex items-center justify-between', |
|
|
'dark:bg-[var(--el-bg-color)]', |
|
|
'dark:bg-[var(--el-bg-color)]', |
|
@ -96,27 +96,28 @@ export default defineComponent({ |
|
|
}) |
|
|
}) |
|
|
</script> |
|
|
</script> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped> |
|
|
<style lang="scss" scoped> |
|
|
$prefix-cls: #{$namespace}-tool-header; |
|
|
$prefix-cls: #{$namespace}-tool-header; |
|
|
|
|
|
|
|
|
.#{$prefix-cls} { |
|
|
.#{$prefix-cls} { |
|
|
transition: left var(--transition-time-02); |
|
|
transition: left var(--transition-time-02); |
|
|
} |
|
|
} |
|
|
::v-deep(.el-menu--horizontal){ |
|
|
.categoryheader{ |
|
|
padding-left:20px; |
|
|
padding-left: 20px; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
::v-deep(.el-menu--horizontal>.el-menu-item){ |
|
|
|
|
|
|
|
|
::v-deep(.el-menu-item){ |
|
|
border-radius: 5px; |
|
|
border-radius: 5px; |
|
|
height: 40px; |
|
|
height: 40px; |
|
|
margin-right: 10px; |
|
|
margin-right: 10px; |
|
|
margin-bottom: 2px; |
|
|
margin-bottom: 2px; |
|
|
background: rgb(242, 245, 248); |
|
|
background: rgb(242, 245, 248); |
|
|
border: 1px solid #ccc; |
|
|
border: 1px solid #ccc; |
|
|
|
|
|
|
|
|
// background: linear-gradient(to top left,var(--left-menu-bg-color),var(--left-menu-text-color)); |
|
|
|
|
|
} |
|
|
} |
|
|
::v-deep(.el-menu--horizontal>.el-menu-item.is-active){ |
|
|
::v-deep(.el-menu-item.is-active){ |
|
|
background: var(--el-menu-hover-bg-color) |
|
|
background: var(--el-menu-hover-bg-color) |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|