feat(ui): adopt Tailwind v4 design system and archive change
- 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
This commit is contained in:
@@ -0,0 +1,30 @@
|
||||
<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>
|
||||
Reference in New Issue
Block a user