Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Prevent adding color in <FormLabel> in Shadcn and React

I have a problem with shadcn's <FormLabel>. How do prevent it from showing a color of red (It actually add a text-destructive automatically) when a field has error/required. I only want the <FormMessage/> to change the color.

<FormField
    control={form.control}
    name="name"
    render={({ field }) => (
        <FormItem>
            <FormLabel>Project Name</FormLabel>
            <FormControl>
                <Input placeholder="Enter project name" {...field} />
            </FormControl>
            <FormMessage />
        </FormItem>
    )}
/>
like image 361
Joseph Avatar asked Oct 27 '25 12:10

Joseph


1 Answers

You could go this route

          <FormField
            control={form.control}
            name='email'
            render={({ field }) => (
              <FormItem>
                <FormLabel className='text-[0.8125rem] text-black dark:text-white data-[error=true]:text-black'>
                  Email Address *
                </FormLabel>
                <FormControl>
                  <Input
                    placeholder='[email protected]'
                    {...field}
                    className='h-[2.875rem]'
                  />
                </FormControl>
                <FormMessage />
              </FormItem>
            )}
          />
like image 191
Ajibola Bello Avatar answered Oct 29 '25 05:10

Ajibola Bello