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

Reverted to commit cb1ef6c177

Browse Source
This commit is contained in:
gpt-engineer-app[bot]
2025-10-06 16:12:02 +00:00
parent 88901a7f20
commit 590d4ede52
12 changed files with 117 additions and 133 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/rides/CoasterStatistics.tsx
View File

@@ -64,7 +64,7 @@ export const CoasterStatistics = ({ statistics }: CoasterStatisticsProps) => {
<h3 className="text-sm font-semibold mb-3 text-muted-foreground uppercase tracking-wide"> <h3 className="text-sm font-semibold mb-3 text-muted-foreground uppercase tracking-wide">
{category} {category}
</h3> </h3>
<div className="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4 gap-3"> <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
{stats {stats
.sort((a, b) => a.display_order - b.display_order) .sort((a, b) => a.display_order - b.display_order)
.map((stat) => ( .map((stat) => (

2
src/components/rides/RecentPhotosPreview.tsx
View File

@@ -66,7 +66,7 @@ export function RecentPhotosPreview({ rideId, onViewAll }: RecentPhotosPreviewPr
</CardTitle> </CardTitle>
</CardHeader> </CardHeader>
<CardContent> <CardContent>
<div className="grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-3 xl:grid-cols-4 gap-3"> <div className="grid grid-cols-2 md:grid-cols-4 gap-3">
{photos.map((photo) => ( {photos.map((photo) => (
<div <div
key={photo.id} key={photo.id}

9
src/components/rides/RideCard.tsx
View File

@@ -10,10 +10,9 @@ interface RideCardProps {
showParkName?: boolean; showParkName?: boolean;
className?: string; className?: string;
parkSlug?: string; parkSlug?: string;
compact?: boolean;
} }
export function RideCard({ ride, showParkName = true, className, parkSlug, compact = false }: RideCardProps) { export function RideCard({ ride, showParkName = true, className, parkSlug }: RideCardProps) {
const navigate = useNavigate(); const navigate = useNavigate();
const handleRideClick = () => { const handleRideClick = () => {
@@ -50,12 +49,12 @@ export function RideCard({ ride, showParkName = true, className, parkSlug, compa
return ( return (
<Card <Card
className={`group overflow-hidden border-border/50 bg-gradient-to-br from-card via-card to-card/80 hover:shadow-2xl hover:shadow-primary/20 transition-all duration-300 cursor-pointer hover:scale-[1.02] ${compact ? 'max-w-sm' : ''} ${className}`} className={`group overflow-hidden border-border/50 bg-gradient-to-br from-card via-card to-card/80 hover:shadow-2xl hover:shadow-primary/20 transition-all duration-300 cursor-pointer hover:scale-[1.02] ${className}`}
onClick={handleRideClick} onClick={handleRideClick}
> >
<div className="relative overflow-hidden"> <div className="relative overflow-hidden">
{/* Image/Icon Section */} {/* Image/Icon Section */}
<div className={`bg-gradient-to-br from-primary/20 via-secondary/20 to-accent/20 flex items-center justify-center relative ${compact ? 'aspect-[4/3]' : 'aspect-video'}`}> <div className="aspect-video bg-gradient-to-br from-primary/20 via-secondary/20 to-accent/20 flex items-center justify-center relative">
{(ride.card_image_url || ride.card_image_id || ride.image_url) ? ( {(ride.card_image_url || ride.card_image_id || ride.image_url) ? (
<img <img
src={ride.card_image_url || (ride.card_image_id ? `https://imagedelivery.net/X-2-mmiWukWxvAQQ2_o-7Q/${ride.card_image_id}/public` : ride.image_url)} src={ride.card_image_url || (ride.card_image_id ? `https://imagedelivery.net/X-2-mmiWukWxvAQQ2_o-7Q/${ride.card_image_id}/public` : ride.image_url)}
@@ -79,7 +78,7 @@ export function RideCard({ ride, showParkName = true, className, parkSlug, compa
</Badge> </Badge>
</div> </div>
<CardContent className={`space-y-3 ${compact ? 'p-3' : 'p-4'}`}> <CardContent className="p-4 space-y-3">
{/* Header */} {/* Header */}
<div className="space-y-1"> <div className="space-y-1">
<h3 className="font-bold text-lg group-hover:text-primary transition-colors line-clamp-1"> <h3 className="font-bold text-lg group-hover:text-primary transition-colors line-clamp-1">

2
src/components/rides/RideHighlights.tsx
View File

@@ -62,7 +62,7 @@ export function RideHighlights({ ride }: RideHighlightsProps) {
<CardTitle>Ride Highlights</CardTitle> <CardTitle>Ride Highlights</CardTitle>
</CardHeader> </CardHeader>
<CardContent> <CardContent>
<div className="max-w-4xl mx-auto grid grid-cols-2 md:grid-cols-4 gap-4"> <div className="grid grid-cols-2 md:grid-cols-4 gap-4">
{highlights.map((highlight, index) => ( {highlights.map((highlight, index) => (
<div key={index} className="flex flex-col items-center text-center p-4 rounded-lg bg-accent/50"> <div key={index} className="flex flex-col items-center text-center p-4 rounded-lg bg-accent/50">
<div className="mb-2">{highlight.icon}</div> <div className="mb-2">{highlight.icon}</div>

2
src/components/rides/SimilarRides.tsx
View File

@@ -79,7 +79,7 @@ export function SimilarRides({ currentRideId, parkId, parkSlug, category }: Simi
<CardTitle>Similar Rides You Might Enjoy</CardTitle> <CardTitle>Similar Rides You Might Enjoy</CardTitle>
</CardHeader> </CardHeader>
<CardContent> <CardContent>
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-2 xl:grid-cols-3 gap-4"> <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
{rides.map((ride) => ( {rides.map((ride) => (
<RideCard <RideCard
key={ride.id} key={ride.id}

2
src/components/rides/TechnicalSpecifications.tsx
View File

@@ -71,7 +71,7 @@ export const TechnicalSpecifications = ({ specifications }: TechnicalSpecificati
<h3 className="text-sm font-semibold mb-3 text-muted-foreground uppercase tracking-wide"> <h3 className="text-sm font-semibold mb-3 text-muted-foreground uppercase tracking-wide">
{category} {category}
</h3> </h3>
<div className="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4 gap-3"> <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
{specs {specs
.sort((a, b) => a.display_order - b.display_order) .sort((a, b) => a.display_order - b.display_order)
.map((spec) => ( .map((spec) => (

2
src/pages/DesignerDetail.tsx
View File

@@ -200,7 +200,7 @@ export default function DesignerDetail() {
</div> </div>
{/* Company Info */} {/* Company Info */}
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4 mb-8 max-w-5xl mx-auto"> <div className="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8">
{designer.founded_year && ( {designer.founded_year && (
<Card> <Card>
<CardContent className="p-4 text-center"> <CardContent className="p-4 text-center">

2
src/pages/ManufacturerDetail.tsx
View File

@@ -202,7 +202,7 @@ export default function ManufacturerDetail() {
</div> </div>
{/* Company Info */} {/* Company Info */}
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4 mb-8 max-w-5xl mx-auto"> <div className="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8">
{manufacturer.founded_year && ( {manufacturer.founded_year && (
<Card> <Card>
<CardContent className="p-3 md:p-4 text-center"> <CardContent className="p-3 md:p-4 text-center">

6
src/pages/OperatorDetail.tsx
View File

@@ -229,7 +229,7 @@ export default function OperatorDetail() {
</div> </div>
{/* Company Info */} {/* Company Info */}
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4 mb-8 max-w-5xl mx-auto"> <div className="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8">
{operator.founded_year && ( {operator.founded_year && (
<Card> <Card>
<CardContent className="p-4 text-center"> <CardContent className="p-4 text-center">
@@ -292,13 +292,13 @@ export default function OperatorDetail() {
</div> </div>
{parksLoading ? ( {parksLoading ? (
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-6"> <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
{[1, 2, 3].map((i) => ( {[1, 2, 3].map((i) => (
<div key={i} className="h-64 bg-muted rounded-lg animate-pulse" /> <div key={i} className="h-64 bg-muted rounded-lg animate-pulse" />
))} ))}
</div> </div>
) : parks.length > 0 ? ( ) : parks.length > 0 ? (
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-6"> <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
{parks.map((park) => ( {parks.map((park) => (
<ParkCard key={park.id} park={park} /> <ParkCard key={park.id} park={park} />
))} ))}

23
src/pages/ParkDetail.tsx
View File

@@ -282,11 +282,11 @@ export default function ParkDetail() {
</div> </div>
{/* Quick Stats */} {/* Quick Stats */}
<div className="relative mb-12 max-w-7xl mx-auto"> <div className="relative mb-12">
{/* Background decorative elements */} {/* Background decorative elements */}
<div className="absolute inset-0 bg-gradient-to-r from-primary/5 via-secondary/5 to-accent/5 rounded-3xl blur-xl"></div> <div className="absolute inset-0 bg-gradient-to-r from-primary/5 via-secondary/5 to-accent/5 rounded-3xl blur-xl"></div>
<div className="relative grid grid-cols-2 sm:grid-cols-2 md:grid-cols-4 gap-4 p-4 bg-gradient-to-br from-background/80 via-card/90 to-background/80 backdrop-blur-sm rounded-xl border border-border/50 shadow-md"> <div className="relative grid grid-cols-2 md:grid-cols-4 gap-4 p-4 bg-gradient-to-br from-background/80 via-card/90 to-background/80 backdrop-blur-sm rounded-xl border border-border/50 shadow-md">
{/* Total Rides */} {/* Total Rides */}
<div className="group relative overflow-hidden"> <div className="group relative overflow-hidden">
<Card className="h-full border-0 bg-gradient-to-br from-primary/10 via-primary/5 to-transparent hover:shadow-lg hover:shadow-primary/15 transition-all duration-300 hover:scale-[1.02]"> <Card className="h-full border-0 bg-gradient-to-br from-primary/10 via-primary/5 to-transparent hover:shadow-lg hover:shadow-primary/15 transition-all duration-300 hover:scale-[1.02]">
@@ -358,7 +358,6 @@ export default function ParkDetail() {
</div> </div>
{/* Main Content */} {/* Main Content */}
<div className="max-w-7xl mx-auto px-4 lg:px-6">
<Tabs defaultValue="overview" className="w-full"> <Tabs defaultValue="overview" className="w-full">
<TabsList className="grid w-full grid-cols-2 md:grid-cols-5"> <TabsList className="grid w-full grid-cols-2 md:grid-cols-5">
<TabsTrigger value="overview">Overview</TabsTrigger> <TabsTrigger value="overview">Overview</TabsTrigger>
@@ -369,16 +368,15 @@ export default function ParkDetail() {
</TabsList> </TabsList>
<TabsContent value="overview" className="mt-6"> <TabsContent value="overview" className="mt-6">
<div className="grid lg:grid-cols-[2fr,1fr] xl:grid-cols-[1.5fr,1fr] gap-6"> <div className="grid lg:grid-cols-3 gap-6">
{/* Left column - main content */} <div className="lg:col-span-2 space-y-6">
<div className="space-y-6">
{/* Description */} {/* Description */}
{park.description && <Card> {park.description && <Card>
<CardHeader> <CardHeader>
<CardTitle>About {park.name}</CardTitle> <CardTitle>About {park.name}</CardTitle>
</CardHeader> </CardHeader>
<CardContent> <CardContent>
<p className="text-muted-foreground leading-relaxed text-base"> <p className="text-muted-foreground leading-relaxed">
{park.description} {park.description}
</p> </p>
</CardContent> </CardContent>
@@ -390,19 +388,18 @@ export default function ParkDetail() {
<CardTitle>Featured Rides</CardTitle> <CardTitle>Featured Rides</CardTitle>
</CardHeader> </CardHeader>
<CardContent> <CardContent>
<div className="grid grid-cols-1 sm:grid-cols-2 gap-4"> <div className="grid sm:grid-cols-2 gap-4">
{rides.slice(0, 6).map(ride => ( {rides.slice(0, 4).map(ride => (
<RideCard <RideCard
key={ride.id} key={ride.id}
ride={ride} ride={ride}
showParkName={false} showParkName={false}
parkSlug={park.slug} parkSlug={park.slug}
className="h-full" className="h-full"
compact={true}
/> />
))} ))}
</div> </div>
{rides.length > 6 && ( {rides.length > 4 && (
<div className="mt-4 text-center"> <div className="mt-4 text-center">
<Button <Button
variant="outline" variant="outline"
@@ -416,8 +413,7 @@ export default function ParkDetail() {
</Card> </Card>
</div> </div>
{/* Right sidebar - sticky on desktop */} <div className="space-y-6">
<div className="space-y-6 lg:sticky lg:top-6 lg:self-start">
{/* Park Information */} {/* Park Information */}
<Card> <Card>
<CardHeader> <CardHeader>
@@ -633,7 +629,6 @@ export default function ParkDetail() {
</Tabs> </Tabs>
</TabsContent> </TabsContent>
</Tabs> </Tabs>
</div>
{/* Add Ride Modal */} {/* Add Ride Modal */}
<Dialog open={isAddRideModalOpen} onOpenChange={setIsAddRideModalOpen}> <Dialog open={isAddRideModalOpen} onOpenChange={setIsAddRideModalOpen}>

6
src/pages/PropertyOwnerDetail.tsx
View File

@@ -229,7 +229,7 @@ export default function PropertyOwnerDetail() {
</div> </div>
{/* Company Info */} {/* Company Info */}
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4 mb-8 max-w-5xl mx-auto"> <div className="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8">
{owner.founded_year && ( {owner.founded_year && (
<Card> <Card>
<CardContent className="p-4 text-center"> <CardContent className="p-4 text-center">
@@ -292,13 +292,13 @@ export default function PropertyOwnerDetail() {
</div> </div>
{parksLoading ? ( {parksLoading ? (
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-6"> <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
{[1, 2, 3].map((i) => ( {[1, 2, 3].map((i) => (
<div key={i} className="h-64 bg-muted rounded-lg animate-pulse" /> <div key={i} className="h-64 bg-muted rounded-lg animate-pulse" />
))} ))}
</div> </div>
) : parks.length > 0 ? ( ) : parks.length > 0 ? (
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-6"> <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
{parks.map((park) => ( {parks.map((park) => (
<ParkCard key={park.id} park={park} /> <ParkCard key={park.id} park={park} />
))} ))}

26
src/pages/RideDetail.tsx
View File

@@ -290,8 +290,7 @@ export default function RideDetail() {
</div> </div>
{/* Quick Stats */} {/* Quick Stats */}
<div className="max-w-4xl mx-auto mb-8 px-4"> <div className="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-6 gap-4 mb-8">
<div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-3">
{ride.max_speed_kmh && ( {ride.max_speed_kmh && (
<Card> <Card>
<CardContent className="p-4 text-center"> <CardContent className="p-4 text-center">
@@ -379,11 +378,9 @@ export default function RideDetail() {
</Card> </Card>
)} )}
</div> </div>
</div>
{/* Main Content */} {/* Main Content */}
<div className="max-w-7xl mx-auto px-4 lg:px-6">
<Tabs value={activeTab} onValueChange={setActiveTab} className="w-full"> <Tabs value={activeTab} onValueChange={setActiveTab} className="w-full">
<TabsList className="grid w-full grid-cols-2 md:grid-cols-5"> <TabsList className="grid w-full grid-cols-2 md:grid-cols-5">
<TabsTrigger value="overview">Overview</TabsTrigger> <TabsTrigger value="overview">Overview</TabsTrigger>
@@ -394,9 +391,8 @@ export default function RideDetail() {
</TabsList> </TabsList>
<TabsContent value="overview" className="mt-6"> <TabsContent value="overview" className="mt-6">
<div className="grid lg:grid-cols-[2fr,1fr] xl:grid-cols-[1.5fr,1fr] gap-6"> <div className="grid lg:grid-cols-3 gap-6">
{/* Left column - main content */} <div className="lg:col-span-2 space-y-6">
<div className="space-y-6">
{/* Description */} {/* Description */}
{ride.description && ( {ride.description && (
<Card> <Card>
@@ -404,7 +400,7 @@ export default function RideDetail() {
<CardTitle>About {ride.name}</CardTitle> <CardTitle>About {ride.name}</CardTitle>
</CardHeader> </CardHeader>
<CardContent> <CardContent>
<p className="text-muted-foreground leading-relaxed text-base"> <p className="text-muted-foreground leading-relaxed">
{ride.description} {ride.description}
</p> </p>
</CardContent> </CardContent>
@@ -415,7 +411,6 @@ export default function RideDetail() {
<FormerNames nameHistory={ride.name_history} currentName={ride.name} /> <FormerNames nameHistory={ride.name_history} currentName={ride.name} />
)} )}
{/* Similar Rides in left column */}
<SimilarRides <SimilarRides
currentRideId={ride.id} currentRideId={ride.id}
parkId={(ride as any).currentParkId} parkId={(ride as any).currentParkId}
@@ -423,15 +418,13 @@ export default function RideDetail() {
category={ride.category} category={ride.category}
/> />
{/* Recent Photos in left column */}
<RecentPhotosPreview <RecentPhotosPreview
rideId={ride.id} rideId={ride.id}
onViewAll={() => setActiveTab("photos")} onViewAll={() => setActiveTab("photos")}
/> />
</div> </div>
{/* Right sidebar - sticky on desktop */} <div className="space-y-6">
<div className="space-y-6 lg:sticky lg:top-6 lg:self-start">
<RatingDistribution <RatingDistribution
rideId={ride.id} rideId={ride.id}
totalReviews={ride.review_count} totalReviews={ride.review_count}
@@ -549,14 +542,13 @@ export default function RideDetail() {
</TabsContent> </TabsContent>
<TabsContent value="specs" className="mt-6"> <TabsContent value="specs" className="mt-6">
<div className="max-w-5xl mx-auto"> <div className="grid md:grid-cols-2 gap-6">
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
{/* Performance Stats */} {/* Performance Stats */}
<Card> <Card>
<CardHeader> <CardHeader>
<CardTitle>Performance</CardTitle> <CardTitle>Performance</CardTitle>
</CardHeader> </CardHeader>
<CardContent className="space-y-3"> <CardContent className="space-y-4">
{ride.max_speed_kmh && ( {ride.max_speed_kmh && (
<div className="flex justify-between"> <div className="flex justify-between">
<span>Maximum Speed</span> <span>Maximum Speed</span>
@@ -615,7 +607,7 @@ export default function RideDetail() {
<CardHeader> <CardHeader>
<CardTitle>Operational Details</CardTitle> <CardTitle>Operational Details</CardTitle>
</CardHeader> </CardHeader>
<CardContent className="space-y-3"> <CardContent className="space-y-4">
{ride.capacity_per_hour && ( {ride.capacity_per_hour && (
<div className="flex justify-between"> <div className="flex justify-between">
<span>Capacity</span> <span>Capacity</span>
@@ -645,7 +637,6 @@ export default function RideDetail() {
</CardContent> </CardContent>
</Card> </Card>
</div> </div>
</div>
</TabsContent> </TabsContent>
<TabsContent value="reviews" className="mt-6"> <TabsContent value="reviews" className="mt-6">
@@ -712,7 +703,6 @@ export default function RideDetail() {
</Tabs> </Tabs>
</TabsContent> </TabsContent>
</Tabs> </Tabs>
</div>
{/* Edit Ride Modal */} {/* Edit Ride Modal */}
<Dialog open={isEditModalOpen} onOpenChange={setIsEditModalOpen}> <Dialog open={isEditModalOpen} onOpenChange={setIsEditModalOpen}>