Tabs hover

Author: Aitem

packages/react-components/src/components/ui/tabs.tsx

@@ -56,7 +56,7 @@ function TabsTrigger({
     <TabsPrimitive.Trigger
       data-slot="tabs-trigger"
       className={cn(
-        "px-3 py-2 text-sm font-regular cursor-pointer text-text-tertiary data-[state=active]:text-text-primary border-b-2 data-[state=active]:border-red-500 border-transparent focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:text-muted-foreground inline-flex flex-1 items-center justify-center whitespace-nowrap transition-[color,box-shadow,border] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "px-3 py-2 text-sm font-regular cursor-pointer text-text-tertiary data-[state=active]:text-text-primary  border-b-2 data-[state=active]:border-border-brand border-transparent hover:text-text-tertiary-hover focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:text-muted-foreground inline-flex flex-1 items-center justify-center whitespace-nowrap transition-[color,box-shadow,border] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className
       )}
       {...props}