main #31
@@ -227,10 +227,10 @@ export function PassesPage({
|
||||
|
||||
<CardHeader className="text-center pb-4 pt-8 flex-shrink-0">
|
||||
<CardTitle className="font-merchant text-2xl leading-tight mb-3 text-gray-900">
|
||||
{cards[0].title}
|
||||
{cards[0]?.title}
|
||||
</CardTitle>
|
||||
<CardDescription className="font-poppins text-sm text-gray-600 leading-relaxed font-normal min-h-[48px] flex items-center justify-center px-4">
|
||||
{cards[0].description}
|
||||
{cards[0]?.description}
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
|
||||
@@ -238,23 +238,23 @@ export function PassesPage({
|
||||
<div className="px-6 pb-6 flex-shrink-0">
|
||||
<div className="flex items-baseline justify-center gap-2 mb-2">
|
||||
<span className="text-5xl font-bold text-gray-900 font-poppins">
|
||||
${cards[0].adultPrice}
|
||||
${cards[0]?.adultPrice}
|
||||
</span>
|
||||
<span className="text-gray-500 font-poppins text-base">
|
||||
/ {passTypes[0].period}
|
||||
</span>
|
||||
</div>
|
||||
<div className="h-5 flex items-center justify-center">
|
||||
{cards[0].adultPrice && (
|
||||
{cards[0]?.adultPrice && (
|
||||
<div className="text-sm text-gray-500 font-poppins">
|
||||
{/* Strikethrough price = originalPrice + $5 */}
|
||||
<span className="line-through mr-2">
|
||||
${parseFloat(cards[0].adultPrice) + 5}
|
||||
${parseFloat(cards[0]?.adultPrice) + 5}
|
||||
</span>
|
||||
<span className="text-green-600 font-medium">
|
||||
Save{" "}
|
||||
{Math.round(
|
||||
((5) / (parseFloat(cards[0].adultPrice) + 5)) * 100
|
||||
((5) / (parseFloat(cards[0]?.adultPrice) + 5)) * 100
|
||||
)}
|
||||
%
|
||||
</span>
|
||||
@@ -299,14 +299,14 @@ export function PassesPage({
|
||||
{/* Unlimited Pass Card */}
|
||||
<div className="relative h-full">
|
||||
<Card
|
||||
className={`relative h-full flex flex-col transition-all duration-300 cursor-pointer ${selectedPass === passTypes[1].id
|
||||
className={`relative h-full flex flex-col transition-all duration-300 cursor-pointer ${selectedPass === passTypes[1]?.id
|
||||
? "ring-2 ring-red-500 shadow-lg" // 🔴 red border when selected
|
||||
: "border-gray-200 shadow-md hover:shadow-lg hover:border-primary/30"
|
||||
}`}
|
||||
onClick={() => setSelectedPass(passTypes[1].id)}
|
||||
onClick={() => setSelectedPass(passTypes[1]?.id)}
|
||||
|
||||
>
|
||||
{passTypes[1].popular && (
|
||||
{passTypes[1]?.popular && (
|
||||
<div className="absolute -top-3 left-1/2 transform -translate-x-1/2 z-10">
|
||||
<Badge className="bg-gradient-to-r from-yellow-400 to-orange-500 text-black px-6 py-1.5 font-semibold shadow-lg font-poppins">
|
||||
Most Popular
|
||||
@@ -320,30 +320,30 @@ export function PassesPage({
|
||||
|
||||
<CardHeader className="text-center pb-4 pt-8 flex-shrink-0">
|
||||
<CardTitle className="font-merchant text-2xl leading-tight mb-3 text-gray-900">
|
||||
{cards[1].title}
|
||||
{cards[1]?.title}
|
||||
</CardTitle>
|
||||
<CardDescription className="font-poppins text-sm text-gray-600 leading-relaxed font-normal min-h-[48px] flex items-center justify-center px-4">
|
||||
{cards[1].description}
|
||||
{cards[1]?.description}
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
|
||||
{/* Pricing */}
|
||||
<div className="px-6 pb-6 flex-shrink-0">
|
||||
<div className="flex items-baseline justify-center gap-2 mb-2">
|
||||
<span className="text-5xl font-bold text-gray-900 font-poppins">${cards[1].adultPrice}</span>
|
||||
<span className="text-gray-500 font-poppins text-base">/ {passTypes[1].period}</span>
|
||||
<span className="text-5xl font-bold text-gray-900 font-poppins">${cards[1]?.adultPrice}</span>
|
||||
<span className="text-gray-500 font-poppins text-base">/ {passTypes[1]?.period}</span>
|
||||
</div>
|
||||
<div className="h-5 flex items-center justify-center">
|
||||
{cards[1].adultPrice && (
|
||||
{cards[1]?.adultPrice && (
|
||||
<div className="text-sm text-gray-500 font-poppins">
|
||||
{/* Strikethrough price = originalPrice + $5 */}
|
||||
<span className="line-through mr-2">
|
||||
${parseFloat(cards[1].adultPrice) + 5}
|
||||
${parseFloat(cards[1]?.adultPrice) + 5}
|
||||
</span>
|
||||
<span className="text-green-600 font-medium">
|
||||
Save{" "}
|
||||
{Math.round(
|
||||
((5) / (parseFloat(cards[1].adultPrice) + 5)) * 100
|
||||
((5) / (parseFloat(cards[1]?.adultPrice) + 5)) * 100
|
||||
)}
|
||||
%
|
||||
</span>
|
||||
@@ -355,7 +355,7 @@ export function PassesPage({
|
||||
<CardContent className="pt-0 pb-6 px-6 flex-grow flex flex-col">
|
||||
<div className="flex-grow mb-6">
|
||||
<div className="space-y-3">
|
||||
{passTypes[1].features.map((feature, index) => (
|
||||
{passTypes[1]?.features.map((feature, index) => (
|
||||
<div key={index} className="flex items-start gap-3">
|
||||
<Check className="w-4 h-4 text-green-500 mt-1 flex-shrink-0" />
|
||||
<span className="text-sm text-gray-700 font-poppins leading-relaxed font-normal">{feature}</span>
|
||||
|
||||
Reference in New Issue
Block a user