Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | 4x | <script setup lang="ts">
defineProps<{
variant?: 'primary' | 'secondary' | 'ghost'
disabled?: boolean
}>()
</script>
<template>
<button
class="rounded-full px-4 py-2 text-sm font-medium transition-all hover:brightness-[0.98] active:scale-[0.98] disabled:opacity-50"
:class="{
'bg-brand-600 text-white shadow-sm': variant === 'primary',
'bg-silver-100 text-silver-700 hover:bg-silver-200': variant === 'secondary' || !variant,
'text-brand-600': variant === 'ghost'
}"
:disabled="disabled"
>
<slot />
</button>
</template> |