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

feat: Implement desktop-first maximization plan

Browse Source
This commit is contained in:
gpt-engineer-app[bot]
2025-10-06 16:22:24 +00:00
parent bc8cb18172
commit d68bbe27a7
10 changed files with 98 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -120,89 +120,77 @@ export function ContentTabs() {
</TabsList>
</div>
<TabsContent value="popular-parks" className="mt-8">
<div className="text-center mb-6">
<h2 className="text-2xl font-bold mb-2">Most Popular Parks</h2>
<p className="text-muted-foreground">Highest rated theme parks worldwide</p>
</div>
<div className="max-w-7xl mx-auto">
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-6">
{popularParks.map((park) => (
<ParkCard key={park.id} park={park} />
))}
</div>
</div>
</TabsContent>
<TabsContent value="popular-parks" className="mt-8">
<div className="text-center mb-6">
<h2 className="text-2xl font-bold mb-2">Most Popular Parks</h2>
<p className="text-muted-foreground">Highest rated theme parks worldwide</p>
</div>
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6 3xl:grid-cols-7 gap-4 xl:gap-5 2xl:gap-4">
{popularParks.map((park) => (
<ParkCard key={park.id} park={park} />
))}
</div>
</TabsContent>
<TabsContent value="trending-parks" className="mt-8">
<div className="text-center mb-6">
<h2 className="text-2xl font-bold mb-2">Trending Parks</h2>
<p className="text-muted-foreground">Most reviewed parks this month</p>
</div>
<div className="max-w-7xl mx-auto">
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-6">
{trendingParks.map((park) => (
<ParkCard key={park.id} park={park} />
))}
</div>
</div>
</TabsContent>
<TabsContent value="trending-parks" className="mt-8">
<div className="text-center mb-6">
<h2 className="text-2xl font-bold mb-2">Trending Parks</h2>
<p className="text-muted-foreground">Most reviewed parks this month</p>
</div>
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6 3xl:grid-cols-7 gap-4 xl:gap-5 2xl:gap-4">
{trendingParks.map((park) => (
<ParkCard key={park.id} park={park} />
))}
</div>
</TabsContent>
<TabsContent value="popular-rides" className="mt-8">
<div className="text-center mb-6">
<h2 className="text-2xl font-bold mb-2">Most Popular Rides</h2>
<p className="text-muted-foreground">Highest rated attractions worldwide</p>
</div>
<div className="max-w-7xl mx-auto">
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-6">
{popularRides.map((ride) => (
<RideCard key={ride.id} ride={ride} />
))}
</div>
</div>
</TabsContent>
<TabsContent value="popular-rides" className="mt-8">
<div className="text-center mb-6">
<h2 className="text-2xl font-bold mb-2">Most Popular Rides</h2>
<p className="text-muted-foreground">Highest rated attractions worldwide</p>
</div>
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6 3xl:grid-cols-7 gap-4 xl:gap-5 2xl:gap-4">
{popularRides.map((ride) => (
<RideCard key={ride.id} ride={ride} />
))}
</div>
</TabsContent>
<TabsContent value="trending-rides" className="mt-8">
<div className="text-center mb-6">
<h2 className="text-2xl font-bold mb-2">Trending Rides</h2>
<p className="text-muted-foreground">Most talked about attractions</p>
</div>
<div className="max-w-7xl mx-auto">
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-6">
{trendingRides.map((ride) => (
<RideCard key={ride.id} ride={ride} />
))}
</div>
</div>
</TabsContent>
<TabsContent value="trending-rides" className="mt-8">
<div className="text-center mb-6">
<h2 className="text-2xl font-bold mb-2">Trending Rides</h2>
<p className="text-muted-foreground">Most talked about attractions</p>
</div>
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6 3xl:grid-cols-7 gap-4 xl:gap-5 2xl:gap-4">
{trendingRides.map((ride) => (
<RideCard key={ride.id} ride={ride} />
))}
</div>
</TabsContent>
<TabsContent value="recent-parks" className="mt-8">
<div className="text-center mb-6">
<h2 className="text-2xl font-bold mb-2">Recently Added Parks</h2>
<p className="text-muted-foreground">Latest parks added to our database</p>
</div>
<div className="max-w-7xl mx-auto">
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-6">
{recentParks.map((park) => (
<ParkCard key={park.id} park={park} />
))}
</div>
</div>
</TabsContent>
<TabsContent value="recent-parks" className="mt-8">
<div className="text-center mb-6">
<h2 className="text-2xl font-bold mb-2">Recently Added Parks</h2>
<p className="text-muted-foreground">Latest parks added to our database</p>
</div>
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6 3xl:grid-cols-7 gap-4 xl:gap-5 2xl:gap-4">
{recentParks.map((park) => (
<ParkCard key={park.id} park={park} />
))}
</div>
</TabsContent>
<TabsContent value="recent-rides" className="mt-8">
<div className="text-center mb-6">
<h2 className="text-2xl font-bold mb-2">Recently Added Rides</h2>
<p className="text-muted-foreground">Latest attractions added to our database</p>
</div>
<div className="max-w-7xl mx-auto">
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-6">
{recentRides.map((ride) => (
<RideCard key={ride.id} ride={ride} />
))}
</div>
</div>
</TabsContent>
<TabsContent value="recent-rides" className="mt-8">
<div className="text-center mb-6">
<h2 className="text-2xl font-bold mb-2">Recently Added Rides</h2>
<p className="text-muted-foreground">Latest attractions added to our database</p>
</div>
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6 3xl:grid-cols-7 gap-4 xl:gap-5 2xl:gap-4">
{recentRides.map((ride) => (
<RideCard key={ride.id} ride={ride} />
))}
</div>
</TabsContent>
</Tabs>
</div>
</section>