Remco/Epicnabbo-Catalogus-Updated-Daily
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix checkbox and switch styles after Base UI migration.

Browse Source 
Co-authored-by: Cursor <[email protected]>
This commit is contained in:
simoleo
2026-07-17 18:35:44 +02:00
co-authored by Cursor
parent 25f01b61b3
commit d2c33145a2
2 changed files with 33 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/ui/checkbox.tsx
+11 -3
View File
@@ -10,16 +10,24 @@ function Checkbox({ className, ...props }: CheckboxPrimitive.Root.Props) {
<CheckboxPrimitive.Root
data-slot="checkbox"
className={cn(
"peer border-input dark:bg-input/30 data-checked:bg-primary data-checked:text-primary-foreground dark:data-checked:bg-primary data-checked:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
"peer relative size-4 shrink-0 rounded-[4px] border shadow-xs outline-none transition-colors",
"border-input bg-background text-transparent",
"hover:border-primary/60",
"data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground",
"data-indeterminate:border-primary data-indeterminate:bg-primary data-indeterminate:text-primary-foreground",
"focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/40",
"aria-invalid:border-destructive aria-invalid:ring-destructive/20",
"disabled:cursor-not-allowed disabled:opacity-50",
className,
)}
{...props}
>
<CheckboxPrimitive.Indicator
data-slot="checkbox-indicator"
className="grid place-content-center text-current transition-none"
className="flex size-full items-center justify-center text-current"
keepMounted={false}
>
<CheckIcon className="size-3.5" />
<CheckIcon className="size-3 stroke-[3]" aria-hidden />
</CheckboxPrimitive.Indicator>
</CheckboxPrimitive.Root>
);