@indielayer/ui
Version:
Indielayer UI Components with Tailwind CSS build for Vue 3
25 lines (24 loc) • 953 B
JavaScript
const s = {
classes: {
wrapper: ({ props: t }) => {
const e = ["inline-flex leading-tight max-w-full"];
return t.size === "xs" ? e.push("px-2 py-0.5 text-xs") : t.size === "sm" ? e.push(" px-2 py-0.5 text-sm") : t.size === "lg" ? e.push(" px-4 py-2 text-lg") : t.size === "xl" ? e.push(" px-5 py-3 text-xl") : e.push(" px-3 py-1.5"), t.outlined && e.push("border-[color:var(--x-tag-border)] dark:border-[color:var(--x-tag-dark-border)]"), (t.filled || !t.outlined) && t.filled && e.push("bg-[color:var(--x-tag-bg)] dark:bg-[color:var(--x-tag-dark-bg)]"), t.rounded ? e.push("rounded-full") : e.push("rounded-md"), e;
}
},
styles: ({ colors: t, props: e, css: r }) => {
const l = t.getPalette(e.color);
return r.variables({
bg: l[100],
text: l[800],
border: l[700],
dark: {
bg: l[600],
border: l[500],
text: l[100]
}
});
}
}, d = s;
export {
d as default
};