Enhance budget tab appearance

Improve the visual distinction of the selected tab in the BudgetProgressCard component by adjusting the shadow.
This commit is contained in:
gpt-engineer-app[bot]
2025-03-21 08:48:14 +00:00
parent 14b04cb384
commit bf2d275d9a
2 changed files with 14 additions and 4 deletions

View File

@@ -1,3 +1,4 @@
import * as React from "react"
import * as TabsPrimitive from "@radix-ui/react-tabs"
@@ -27,7 +28,7 @@ const TabsTrigger = React.forwardRef<
<TabsPrimitive.Trigger
ref={ref}
className={cn(
"inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",
"inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm data-[state=inactive]:text-gray-500 data-[state=inactive]:hover:text-gray-700 data-[state=inactive]:hover:bg-gray-100/30",
className
)}
{...props}