新增 menu 组件 theme 属性, 可选值 dark 与 light
This commit is contained in:
@@ -269,4 +269,18 @@
|
||||
left: 0;
|
||||
overflow-x: hidden;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.layui-nav-light {
|
||||
background-color: #ffffff;
|
||||
* {
|
||||
color: grey!important;
|
||||
}
|
||||
.layui-nav-itemed > .layui-nav-child {
|
||||
background-color: rgba(0, 0, 0, 0.02);
|
||||
}
|
||||
}
|
||||
|
||||
.layui-nav-tree .layui-this * {
|
||||
color: white!important;
|
||||
}
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<ul class="layui-nav" :class="[tree ? 'layui-nav-tree' : '']">
|
||||
<ul class="layui-nav" :class="[tree ? 'layui-nav-tree' : '', theme === 'dark' ? 'layui-nav-dark':'layui-nav-light' ]">
|
||||
<slot></slot>
|
||||
</ul>
|
||||
</template>
|
||||
@@ -12,6 +12,7 @@ export interface LayMenuProps {
|
||||
selectedKey?: string;
|
||||
openKeys?: string[];
|
||||
tree?: boolean;
|
||||
theme?: string;
|
||||
}
|
||||
|
||||
const emit = defineEmits(["update:selectedKey", "update:openKeys"]);
|
||||
@@ -20,6 +21,7 @@ const props = withDefaults(defineProps<LayMenuProps>(), {
|
||||
selectedKey: "",
|
||||
openKeys: () => [],
|
||||
tree: false,
|
||||
theme: 'dark'
|
||||
});
|
||||
|
||||
const isTree = computed(() => props.tree);
|
||||
|
||||
Reference in New Issue
Block a user