packages/ui: transition fixes
This commit is contained in:
parent
cda13faf9c
commit
d5876d8e73
@ -4,17 +4,20 @@ import { cva } from 'class-variance-authority';
|
||||
import type { ButtonHTMLAttributes } from 'react';
|
||||
import { forwardRef } from 'react';
|
||||
|
||||
const variants = cva('rounded-sm h-10 px-5 py-2.5 text-sm font-medium text-white', {
|
||||
defaultVariants: {
|
||||
color: 'default',
|
||||
},
|
||||
variants: {
|
||||
color: {
|
||||
danger: 'bg-danger hover:bg-danger-700',
|
||||
default: 'bg-primary hover:bg-primary-700',
|
||||
const variants = cva(
|
||||
'rounded-sm h-10 px-5 py-2.5 text-sm font-medium text-white transition-all ease-in-out',
|
||||
{
|
||||
defaultVariants: {
|
||||
color: 'default',
|
||||
},
|
||||
},
|
||||
});
|
||||
variants: {
|
||||
color: {
|
||||
danger: 'bg-danger hover:bg-danger-700',
|
||||
default: 'bg-primary hover:bg-primary-700',
|
||||
},
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
export type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & VariantProps<typeof variants>;
|
||||
|
||||
|
||||
@ -26,7 +26,7 @@ const Label = forwardRef<HTMLLabelElement, LabelProps>(
|
||||
);
|
||||
|
||||
const variants = cva(
|
||||
'w-4 h-4 focus:ring-transparent rounded-sm hover:border-primary-500 disabled:hover:border-gray-300 border-gray-300 text-sm text-primary outline-none transition-all ease-linear hover:transition-all focus:transition-all disabled:cursor-not-allowed disabled:text-opacity-30'
|
||||
'w-4 h-4 focus:ring-transparent rounded-sm hover:border-primary-500 disabled:hover:border-gray-300 border-gray-300 text-sm text-primary outline-none transition-all ease-in-out disabled:cursor-not-allowed disabled:text-opacity-30'
|
||||
);
|
||||
|
||||
export type CheckboxProps = React.InputHTMLAttributes<HTMLInputElement> &
|
||||
|
||||
@ -4,7 +4,7 @@ import { cva } from 'class-variance-authority';
|
||||
import { forwardRef } from 'react';
|
||||
|
||||
const variants = cva(
|
||||
'[&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none focus:ring-0 hover:border-primary-500 focus:border-primary-500 block w-full rounded-sm border disabled:hover:border-gray-300 border-gray-300 h-9 p-2 px-3 text-sm text-gray-900 outline-none transition-all ease-in-out hover:transition-all focus:transition-all disabled:cursor-not-allowed disabled:text-opacity-30'
|
||||
'[&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none focus:ring-0 hover:border-primary-500 focus:border-primary-500 block w-full rounded-sm border disabled:hover:border-gray-300 border-gray-300 h-9 p-2 px-3 text-sm text-gray-900 outline-none transition-all ease-in-out disabled:cursor-not-allowed disabled:text-opacity-30'
|
||||
);
|
||||
|
||||
export type InputProps = React.InputHTMLAttributes<HTMLInputElement> &
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user