Initial website implementation with Hero section
This commit is contained in:
60
app/components/ui/frame/index.ts
Normal file
60
app/components/ui/frame/index.ts
Normal file
@ -0,0 +1,60 @@
|
||||
import type { VariantProps } from "class-variance-authority"
|
||||
import { cva } from "class-variance-authority"
|
||||
|
||||
export { default as Frame } from "./Frame.vue"
|
||||
|
||||
export const frameVariants = cva(
|
||||
"border-solid",
|
||||
{
|
||||
variants: {
|
||||
border: {
|
||||
default: "border-border",
|
||||
input: "border-input",
|
||||
},
|
||||
borderRadius: {
|
||||
default: "rounded-md",
|
||||
round: "rounded-2xl",
|
||||
circle: "rounded-full",
|
||||
none: "",
|
||||
},
|
||||
borderPlacement: {
|
||||
default: "border-2",
|
||||
bottom: "border-b-2",
|
||||
left: "border-l-2",
|
||||
right: "border-r-2",
|
||||
top: "border-t-2",
|
||||
},
|
||||
background: {
|
||||
default: "bg-background",
|
||||
muted: "bg-muted",
|
||||
primary: "bg-primary"
|
||||
},
|
||||
padding: {
|
||||
default: "p-8",
|
||||
loose: "p-12",
|
||||
dense: "p-3",
|
||||
none: "",
|
||||
},
|
||||
margin: {
|
||||
default: "m-12",
|
||||
dense: "m-8",
|
||||
none: "",
|
||||
},
|
||||
},
|
||||
defaultVariants: {
|
||||
border: "default",
|
||||
borderRadius: "default",
|
||||
borderPlacement: "default",
|
||||
background: "default",
|
||||
padding: "default",
|
||||
margin: "default",
|
||||
},
|
||||
},
|
||||
)
|
||||
|
||||
export type FrameVariants = VariantProps<typeof frameVariants>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user