You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

27 lines
1.0 KiB

import type { VariantProps } from 'class-variance-authority'
import { cva } from 'class-variance-authority'
export { default as Input } from './Input.vue'
export const inputVariants = cva(
'flex w-full rounded-xl border border-white/20 bg-white/10 px-4 py-3 text-base text-white ring-offset-transparent file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-white/50 transition-all duration-300 hover:bg-white/15 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/50 focus-visible:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50',
{
variants: {
variant: {
default: '',
error: 'border-destructive focus-visible:ring-destructive',
},
size: {
default: 'h-12',
sm: 'h-10 text-sm px-3 py-2',
lg: 'h-14 text-lg px-5 py-4',
},
},
defaultVariants: {
variant: 'default',
size: 'default',
},
}
)
export type InputVariants = VariantProps<typeof inputVariants>