- Add tailwindcss v4 + @tailwindcss/vite to mall, shop-admin, admin - Add @vmall/shared/theme.css tokens with html[data-accent] presets - Add @vmall/ui kit (VBtn/VBadge/VField/VInput/VCard/VPanel/VTable/VPage, VAccentSwatch, useAccent) as a Nuxt module - Convert all three apps to kit + utilities; delete ui.css/mall.css and every <style scoped>; consoles get accent presets, mall locked to red - Fix VCard boolean prop default (padding) and PDP/store stale useAsyncData keys on param navigation - Archive adopt-tailwind-design-system; new frontend-ui capability spec
31 lines
963 B
Vue
31 lines
963 B
Vue
<script setup lang="ts">
|
|
const props = withDefaults(
|
|
defineProps<{
|
|
variant?: "default" | "primary" | "danger";
|
|
size?: "md" | "sm";
|
|
type?: "button" | "submit" | "reset";
|
|
disabled?: boolean;
|
|
}>(),
|
|
{ variant: "default", size: "md", type: "button", disabled: false },
|
|
);
|
|
|
|
const base =
|
|
"inline-flex cursor-pointer items-center justify-center gap-1 rounded-md border text-sm font-medium transition-colors disabled:cursor-not-allowed disabled:opacity-50";
|
|
const variants = {
|
|
default: "border-border bg-surface text-text hover:bg-bg",
|
|
primary: "border-primary bg-primary text-white hover:bg-primary-hover",
|
|
danger: "border-danger text-danger hover:bg-danger/10",
|
|
} as const;
|
|
const sizes = { md: "px-4 py-2", sm: "px-2.5 py-1 text-[13px]" } as const;
|
|
</script>
|
|
|
|
<template>
|
|
<button
|
|
:type="props.type"
|
|
:disabled="props.disabled"
|
|
:class="[base, variants[props.variant], sizes[props.size]]"
|
|
>
|
|
<slot />
|
|
</button>
|
|
</template>
|