pacnpal/thrilltrack-explorer
1
0
Fork 0
mirror of https://github.com/pacnpal/thrilltrack-explorer.git synced 2025-12-20 15:51:12 -05:00
Code Issues Packages Projects Releases Wiki Activity

Refactor: Simplify tab styles to minimal pills

Browse Source
This commit is contained in:
gpt-engineer-app[bot]
2025-10-28 13:36:37 +00:00
parent 385cc33961
commit f8fcaaa337
1 changed files with 11 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/homepage/ContentTabs.tsx
View File

@@ -346,35 +346,35 @@ export function ContentTabs() {
<div className="container mx-auto px-4"> <div className="container mx-auto px-4">
<Tabs defaultValue="trending-parks" className="w-full"> <Tabs defaultValue="trending-parks" className="w-full">
<div className="text-center mb-8"> <div className="text-center mb-8">
<TabsList className="flex flex-wrap justify-center w-full max-w-7xl mx-auto gap-2 p-3 bg-gradient-to-r from-primary/5 via-secondary/5 to-accent/5 dark:from-primary/10 dark:via-secondary/10 dark:to-accent/10 border border-primary/10 dark:border-primary/20 rounded-xl backdrop-blur-sm"> <TabsList className="inline-flex flex-wrap justify-center gap-2 p-2 bg-muted/30 rounded-lg">
<TabsTrigger value="trending-parks" className="text-sm md:text-xs lg:text-sm px-3 py-4 md:px-2 md:py-3 rounded-lg border border-border/30 bg-card/50 backdrop-blur-sm shadow-sm hover:shadow-md hover:border-primary/40 hover:-translate-y-0.5 data-[state=active]:border-primary/60 data-[state=active]:bg-gradient-to-br data-[state=active]:from-primary/15 data-[state=active]:to-accent/10 data-[state=active]:shadow-[0_0_20px_rgba(139,92,246,0.4)] data-[state=active]:translate-y-0 transition-all duration-300 font-medium"> <TabsTrigger value="trending-parks" className="px-4 py-2 text-sm font-medium rounded-full data-[state=active]:bg-primary data-[state=active]:text-primary-foreground hover:bg-muted/50 transition-colors">
Trending Parks Trending Parks
</TabsTrigger> </TabsTrigger>
<TabsTrigger value="trending-rides" className="text-sm md:text-xs lg:text-sm px-3 py-4 md:px-2 md:py-3 rounded-lg border border-border/30 bg-card/50 backdrop-blur-sm shadow-sm hover:shadow-md hover:border-primary/40 hover:-translate-y-0.5 data-[state=active]:border-primary/60 data-[state=active]:bg-gradient-to-br data-[state=active]:from-primary/15 data-[state=active]:to-accent/10 data-[state=active]:shadow-[0_0_20px_rgba(139,92,246,0.4)] data-[state=active]:translate-y-0 transition-all duration-300 font-medium"> <TabsTrigger value="trending-rides" className="px-4 py-2 text-sm font-medium rounded-full data-[state=active]:bg-primary data-[state=active]:text-primary-foreground hover:bg-muted/50 transition-colors">
Trending Rides Trending Rides
</TabsTrigger> </TabsTrigger>
<TabsTrigger value="recent-parks" className="text-sm md:text-xs lg:text-sm px-3 py-4 md:px-2 md:py-3 rounded-lg border border-border/30 bg-card/50 backdrop-blur-sm shadow-sm hover:shadow-md hover:border-primary/40 hover:-translate-y-0.5 data-[state=active]:border-primary/60 data-[state=active]:bg-gradient-to-br data-[state=active]:from-primary/15 data-[state=active]:to-accent/10 data-[state=active]:shadow-[0_0_20px_rgba(139,92,246,0.4)] data-[state=active]:translate-y-0 transition-all duration-300 font-medium"> <TabsTrigger value="recent-parks" className="px-4 py-2 text-sm font-medium rounded-full data-[state=active]:bg-primary data-[state=active]:text-primary-foreground hover:bg-muted/50 transition-colors">
New Parks New Parks
</TabsTrigger> </TabsTrigger>
<TabsTrigger value="recent-rides" className="text-sm md:text-xs lg:text-sm px-3 py-4 md:px-2 md:py-3 rounded-lg border border-border/30 bg-card/50 backdrop-blur-sm shadow-sm hover:shadow-md hover:border-primary/40 hover:-translate-y-0.5 data-[state=active]:border-primary/60 data-[state=active]:bg-gradient-to-br data-[state=active]:from-primary/15 data-[state=active]:to-accent/10 data-[state=active]:shadow-[0_0_20px_rgba(139,92,246,0.4)] data-[state=active]:translate-y-0 transition-all duration-300 font-medium"> <TabsTrigger value="recent-rides" className="px-4 py-2 text-sm font-medium rounded-full data-[state=active]:bg-primary data-[state=active]:text-primary-foreground hover:bg-muted/50 transition-colors">
New Rides New Rides
</TabsTrigger> </TabsTrigger>
<TabsTrigger value="recent-changes" className="text-sm md:text-xs lg:text-sm px-3 py-4 md:px-2 md:py-3 rounded-lg border border-border/30 bg-card/50 backdrop-blur-sm shadow-sm hover:shadow-md hover:border-primary/40 hover:-translate-y-0.5 data-[state=active]:border-primary/60 data-[state=active]:bg-gradient-to-br data-[state=active]:from-primary/15 data-[state=active]:to-accent/10 data-[state=active]:shadow-[0_0_20px_rgba(139,92,246,0.4)] data-[state=active]:translate-y-0 transition-all duration-300 font-medium"> <TabsTrigger value="recent-changes" className="px-4 py-2 text-sm font-medium rounded-full data-[state=active]:bg-primary data-[state=active]:text-primary-foreground hover:bg-muted/50 transition-colors">
Recent Changes Recent Changes
</TabsTrigger> </TabsTrigger>
<TabsTrigger value="recently-opened" className="text-sm md:text-xs lg:text-sm px-3 py-4 md:px-2 md:py-3 rounded-lg border border-border/30 bg-card/50 backdrop-blur-sm shadow-sm hover:shadow-md hover:border-primary/40 hover:-translate-y-0.5 data-[state=active]:border-primary/60 data-[state=active]:bg-gradient-to-br data-[state=active]:from-primary/15 data-[state=active]:to-accent/10 data-[state=active]:shadow-[0_0_20px_rgba(139,92,246,0.4)] data-[state=active]:translate-y-0 transition-all duration-300 font-medium"> <TabsTrigger value="recently-opened" className="px-4 py-2 text-sm font-medium rounded-full data-[state=active]:bg-primary data-[state=active]:text-primary-foreground hover:bg-muted/50 transition-colors">
Recently Opened Recently Opened
</TabsTrigger> </TabsTrigger>
<TabsTrigger value="highest-rated-parks" className="text-sm md:text-xs lg:text-sm px-3 py-4 md:px-2 md:py-3 rounded-lg border border-border/30 bg-card/50 backdrop-blur-sm shadow-sm hover:shadow-md hover:border-primary/40 hover:-translate-y-0.5 data-[state=active]:border-primary/60 data-[state=active]:bg-gradient-to-br data-[state=active]:from-primary/15 data-[state=active]:to-accent/10 data-[state=active]:shadow-[0_0_20px_rgba(139,92,246,0.4)] data-[state=active]:translate-y-0 transition-all duration-300 font-medium"> <TabsTrigger value="highest-rated-parks" className="px-4 py-2 text-sm font-medium rounded-full data-[state=active]:bg-primary data-[state=active]:text-primary-foreground hover:bg-muted/50 transition-colors">
Top Parks Top Parks
</TabsTrigger> </TabsTrigger>
<TabsTrigger value="highest-rated-rides" className="text-sm md:text-xs lg:text-sm px-3 py-4 md:px-2 md:py-3 rounded-lg border border-border/30 bg-card/50 backdrop-blur-sm shadow-sm hover:shadow-md hover:border-primary/40 hover:-translate-y-0.5 data-[state=active]:border-primary/60 data-[state=active]:bg-gradient-to-br data-[state=active]:from-primary/15 data-[state=active]:to-accent/10 data-[state=active]:shadow-[0_0_20px_rgba(139,92,246,0.4)] data-[state=active]:translate-y-0 transition-all duration-300 font-medium"> <TabsTrigger value="highest-rated-rides" className="px-4 py-2 text-sm font-medium rounded-full data-[state=active]:bg-primary data-[state=active]:text-primary-foreground hover:bg-muted/50 transition-colors">
Top Rides Top Rides
</TabsTrigger> </TabsTrigger>
<TabsTrigger value="opening-soon" className="text-sm md:text-xs lg:text-sm px-3 py-4 md:px-2 md:py-3 rounded-lg border border-border/30 bg-card/50 backdrop-blur-sm shadow-sm hover:shadow-md hover:border-primary/40 hover:-translate-y-0.5 data-[state=active]:border-primary/60 data-[state=active]:bg-gradient-to-br data-[state=active]:from-primary/15 data-[state=active]:to-accent/10 data-[state=active]:shadow-[0_0_20px_rgba(139,92,246,0.4)] data-[state=active]:translate-y-0 transition-all duration-300 font-medium"> <TabsTrigger value="opening-soon" className="px-4 py-2 text-sm font-medium rounded-full data-[state=active]:bg-primary data-[state=active]:text-primary-foreground hover:bg-muted/50 transition-colors">
Opening Soon Opening Soon
</TabsTrigger> </TabsTrigger>
<TabsTrigger value="closing-soon" className="text-sm md:text-xs lg:text-sm px-3 py-4 md:px-2 md:py-3 rounded-lg border border-border/30 bg-card/50 backdrop-blur-sm shadow-sm hover:shadow-md hover:border-primary/40 hover:-translate-y-0.5 data-[state=active]:border-primary/60 data-[state=active]:bg-gradient-to-br data-[state=active]:from-primary/15 data-[state=active]:to-accent/10 data-[state=active]:shadow-[0_0_20px_rgba(139,92,246,0.4)] data-[state=active]:translate-y-0 transition-all duration-300 font-medium"> <TabsTrigger value="closing-soon" className="px-4 py-2 text-sm font-medium rounded-full data-[state=active]:bg-primary data-[state=active]:text-primary-foreground hover:bg-muted/50 transition-colors">
Closing Soon Closing Soon
</TabsTrigger> </TabsTrigger>
</TabsList> </TabsList>