learning/ignitegym
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: style invalid input

Browse source
This commit is contained in:
Vinicius Souza 2024-10-28 14:36:48 -03:00
parent 08f81b743d
commit 4b91c06761
1 changed files with 5 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/components/Input.tsx
View file

@ -24,12 +24,16 @@ export function Input({
return ( return (
<FormControl w="$full" mb="$4" isInvalid={invalid}> <FormControl w="$full" mb="$4" isInvalid={invalid}>
<GSInput <GSInput
isInvalid={invalid}
h="$14" h="$14"
borderColor="$gray700" borderColor="$gray700"
borderWidth="$1" borderWidth="$1"
borderRadius="$md" borderRadius="$md"
$focus={{ $focus={{
borderColor: '$green500', borderColor: invalid ? '$red500' : '$green500',
}}
$invalid={{
borderColor: '$red500',
}} }}
isReadOnly={isReadOnly} isReadOnly={isReadOnly}
opacity={isReadOnly ? 0.5 : 1}> opacity={isReadOnly ? 0.5 : 1}>