style: 统一 DropdownMenu 组件样式与 Select 组件一致

- 背景色从 bg-popover (纯白) 改为 bg-card (暖色米白)
- 圆角从 rounded-xl 改为 rounded-2xl
- 阴影从 shadow-lg 改为 shadow-2xl
- 添加 backdrop-blur-xl 毛玻璃效果
- 悬停状态使用 data-[highlighted] 替代 hover
This commit is contained in:
LewisPen
2026-01-23 11:08:07 +08:00
parent 08a3148ab3
commit bfb4c2fa3c
2 changed files with 2 additions and 2 deletions

View File

@@ -27,7 +27,7 @@ const props = withDefaults(defineProps<Props>(), {
const contentClass = computed(() =>
cn(
'z-[200] min-w-[8rem] overflow-hidden rounded-xl border border-border bg-popover p-1 text-popover-foreground shadow-lg',
'z-[200] min-w-[8rem] overflow-hidden rounded-2xl border border-border bg-card p-1 text-foreground shadow-2xl backdrop-blur-xl',
'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',
'data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
props.class

View File

@@ -17,7 +17,7 @@ defineEmits<{
const itemClass = computed(() =>
cn(
'relative flex cursor-pointer select-none items-center rounded-lg px-3 py-1.5 text-sm outline-none',
'hover:bg-accent focus:bg-accent focus:text-accent-foreground',
'data-[highlighted]:bg-accent focus:bg-accent text-foreground',
'transition-colors data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
props.class
)