SakurasanandClaude
6adadebaf0
- 修 nav 激活态残留 text-zinc-50 导致浅色下白字白底 - @theme 令牌改实色字面量, 浅色用 [data-theme=light] 覆盖同一批 --color-* - 新增 soft 令牌(accent/ok/warn/err, color-mix 运行时解析)替代烘焙的透明度修饰符, 修复 badge 实色底、focus ring 实线等问题 - ThemeToggle 改三选下拉(浅色/深色/跟随系统), 系统自动为显式选项 - 浅色强调色调深保证 WCAG 对比度, 全量复查无残留硬编码颜色类 Co-Authored-By: Claude <noreply@anthropic.com>
28 lines
1.0 KiB
Vue
28 lines
1.0 KiB
Vue
<script setup lang="ts">
|
|
withDefaults(
|
|
defineProps<{
|
|
variant?: 'primary' | 'ghost' | 'danger'
|
|
size?: 'sm' | 'md'
|
|
loading?: boolean
|
|
disabled?: boolean
|
|
}>(),
|
|
{ variant: 'primary', size: 'md', loading: false, disabled: false },
|
|
)
|
|
</script>
|
|
|
|
<template>
|
|
<button
|
|
:disabled="disabled || loading"
|
|
class="inline-flex items-center justify-center gap-2 rounded-md font-medium transition-[transform,background-color,border-color,color] duration-150 active:scale-[0.98] disabled:pointer-events-none disabled:opacity-50 select-none"
|
|
:class="[
|
|
size === 'sm' ? 'h-8 px-3 text-xs' : 'h-10 px-4 text-sm',
|
|
variant === 'primary' && 'bg-accent text-accent-ink hover:bg-accent-strong',
|
|
variant === 'ghost' && 'border border-edge2 text-ink hover:border-edge2 hover:bg-surface2',
|
|
variant === 'danger' && 'border border-err text-err hover:border-err hover:bg-err-soft',
|
|
]"
|
|
>
|
|
<span v-if="loading" class="size-3.5 animate-spin rounded-full border-2 border-current border-t-transparent" />
|
|
<slot />
|
|
</button>
|
|
</template>
|