remove semibold font from labels

kotalco · Jan 22, 2024 · 59b4695 · 59b4695
1 parent 7ff6f60
commit 59b4695
Show file tree

Hide file tree

Showing 8 changed files with 9 additions and 33 deletions.
diff --git a/src/components/form/checkbox.tsx b/src/components/form/checkbox.tsx
@@ -31,11 +31,7 @@ export const Checkbox = ({
           id={labelId}
           {...props}
         />
-        {label && (
-          <Label htmlFor={labelId} className="font-semibold ">
-            {label}
-          </Label>
-        )}
+        {label && <Label htmlFor={labelId}>{label}</Label>}
       </div>
 
       <FormErrors id={id} errors={errors} />

diff --git a/src/components/form/input.tsx b/src/components/form/input.tsx
@@ -24,11 +24,7 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(
     return (
       <div className="space-y-2">
         <div className="space-y-1">
-          {label && (
-            <Label htmlFor={id} className="font-semibold">
-              {label}
-            </Label>
-          )}
+          {label && <Label htmlFor={id}>{label}</Label>}
           <ShadInput
             ref={ref}
             id={id}

diff --git a/src/components/form/multi-select.tsx b/src/components/form/multi-select.tsx
@@ -126,7 +126,7 @@ const MultiSelect = React.forwardRef<HTMLButtonElement, MultiSelectProps>(
       <div className="space-y-2">
         <div className="space-y-2">
           {label && (
-            <Label htmlFor={id} className="font-semibold block ">
+            <Label htmlFor={id} className="block">
               {label}
             </Label>
           )}

diff --git a/src/components/form/select-with-input.tsx b/src/components/form/select-with-input.tsx
@@ -59,11 +59,7 @@ export const SelectWithInput: React.FC<SelectWithInputProps> = ({
   return (
     <div className="space-y-2">
       <div className="space-y-1">
-        {label && (
-          <Label htmlFor={id} className="font-semibold ">
-            {label}
-          </Label>
-        )}
+        {label && <Label htmlFor={id}>{label}</Label>}
         <div className="flex">
           <Select
             name={`${id}-select`}

diff --git a/src/components/form/select.tsx b/src/components/form/select.tsx
@@ -50,11 +50,7 @@ export const Select = ({
   return (
     <div className="space-y-2">
       <div className="space-y-1">
-        {label && (
-          <Label htmlFor={id} className="font-semibold ">
-            {label}
-          </Label>
-        )}
+        {label && <Label htmlFor={id}>{label}</Label>}
         <div className="flex">
           <ShadSelect
             disabled={pending || disabled}

diff --git a/src/components/form/textarea.tsx b/src/components/form/textarea.tsx
@@ -49,11 +49,7 @@ export const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
       <div className="space-y-2">
         <div className="space-y-1">
           <div>
-            {label && (
-              <Label htmlFor={id} className="font-semibold ">
-                {label}
-              </Label>
-            )}
+            {label && <Label htmlFor={id}>{label}</Label>}
             {tooltip && (
               <TooltipProvider delayDuration={0}>
                 <Tooltip>

diff --git a/src/components/form/toggle.tsx b/src/components/form/toggle.tsx
@@ -33,17 +33,13 @@ export const Toggle = ({
     <div className="space-y-2 w-full">
       <div className={cn("flex items-center space-x-2", className)}>
         {label && labelPosition === "left" && (
-          <Label htmlFor={id} className="font-semibold ">
-            {label}
-          </Label>
+          <Label htmlFor={id}>{label}</Label>
         )}
 
         <Switch disabled={pending || disabled} name={id} id={id} {...props} />
 
         {label && labelPosition === "right" && (
-          <Label htmlFor={id} className="font-semibold ">
-            {label}
-          </Label>
+          <Label htmlFor={id}>{label}</Label>
         )}
       </div>
 

diff --git a/src/components/shared/auth/card-wrapper.tsx b/src/components/shared/auth/card-wrapper.tsx
@@ -12,7 +12,7 @@ export const CardWrapper = ({ children, title }: CardWrapperProps) => {
       <Logo />
       <Card className="w-full px-3 sm:max-w-md">
         <CardHeader className="flex items-center justify-center">
-          <CardTitle className="text-center pt-1 text-2xl font-bold tracking-tight font-nunito">
+          <CardTitle className="text-center pt-1 text-2xl font-normal tracking-tight font-nunito text-foreground/70">
             {title}
           </CardTitle>
         </CardHeader>