diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx index 0ca64f0..40ed8ab 100644 --- a/src/components/Layout.tsx +++ b/src/components/Layout.tsx @@ -10,38 +10,39 @@ export default function Layout() {
-
- -
+ -
- -
+ + + - + -
- -
+ -
- -
+ diff --git a/src/pages/HomePage/sections/About.tsx b/src/pages/HomePage/sections/About.tsx new file mode 100644 index 0000000..f812658 --- /dev/null +++ b/src/pages/HomePage/sections/About.tsx @@ -0,0 +1,20 @@ +// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this +// file as the canonical source for the "about" section. + +import React from 'react'; +import AboutCursorTrail from "@/components/sections/about/AboutCursorTrail"; + +export default function AboutSection(): React.JSX.Element { + return ( +
+ +
+ ); +} diff --git a/src/pages/HomePage/sections/Bookings.tsx b/src/pages/HomePage/sections/Bookings.tsx new file mode 100644 index 0000000..d2d519c --- /dev/null +++ b/src/pages/HomePage/sections/Bookings.tsx @@ -0,0 +1,71 @@ +import TextAnimation from '@/components/ui/TextAnimation'; +import ScrollReveal from '@/components/ui/ScrollReveal'; +import Tag from '@/components/ui/Tag'; +import ImageOrVideo from '@/components/ui/ImageOrVideo'; + +export default function BookingsSection() { + const steps = [ + { + tag: "Login", + title: "Access Your Account", + subtitle: "Step 1", + description: "Log in to your member portal using your credentials.", + imageSrc: "https://images.unsplash.com/photo-1595435934249-5df7ed86e1c0?q=80&w=1000&auto=format&fit=crop", + }, + { + tag: "Select", + title: "Choose Your Court", + subtitle: "Step 2", + description: "Browse available courts and times up to 7 days in advance (14 days for Pro members).", + imageSrc: "https://images.unsplash.com/photo-1622279457486-62dcc4a431d6?q=80&w=1000&auto=format&fit=crop", + }, + { + tag: "Confirm", + title: "Secure Your Time", + subtitle: "Step 3", + description: "Confirm your booking and receive an email confirmation with your court details.", + imageSrc: "https://images.unsplash.com/photo-1589806053641-6101469b1110?q=80&w=1000&auto=format&fit=crop", + }, + ]; + + return ( +
+
+
+ + +

+ Reserving a court is quick and easy for members. Follow these simple steps to secure your playtime. +

+
+ +
+ {steps.map((step, index) => ( + +
+
+
+ +
+
+
+
+ {step.subtitle} +
+

{step.title}

+

{step.description}

+
+
+ + ))} +
+
+
+ ); +} \ No newline at end of file diff --git a/src/pages/HomePage/sections/Contact.tsx b/src/pages/HomePage/sections/Contact.tsx new file mode 100644 index 0000000..68ec9db --- /dev/null +++ b/src/pages/HomePage/sections/Contact.tsx @@ -0,0 +1,23 @@ +// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this +// file as the canonical source for the "contact" section. + +import React from 'react'; +import ContactBar from "@/components/sections/contact/ContactBar"; +import { Phone, MessageCircle, Mail } from "lucide-react"; + +export default function ContactSection(): React.JSX.Element { + return ( +
+ +
+ ); +} diff --git a/src/pages/HomePage/sections/Features.tsx b/src/pages/HomePage/sections/Features.tsx new file mode 100644 index 0000000..1c0e350 --- /dev/null +++ b/src/pages/HomePage/sections/Features.tsx @@ -0,0 +1,20 @@ +// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this +// file as the canonical source for the "features" section. + +import React from 'react'; +import FeaturesGridSplitLarge from "@/components/sections/features/FeaturesGridSplitLarge"; + +export default function FeaturesSection(): React.JSX.Element { + return ( +
+ +
+ ); +} diff --git a/src/pages/HomePage/sections/Hero.tsx b/src/pages/HomePage/sections/Hero.tsx new file mode 100644 index 0000000..dfa75dd --- /dev/null +++ b/src/pages/HomePage/sections/Hero.tsx @@ -0,0 +1,21 @@ +// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this +// file as the canonical source for the "hero" section. + +import React from 'react'; +import HeroBillboardBrandFloatingCards from "@/components/sections/hero/HeroBillboardBrandFloatingCards"; + +export default function HeroSection(): React.JSX.Element { + return ( +
+ +
+ ); +} diff --git a/src/pages/HomePage/sections/Membership.tsx b/src/pages/HomePage/sections/Membership.tsx new file mode 100644 index 0000000..cf3c707 --- /dev/null +++ b/src/pages/HomePage/sections/Membership.tsx @@ -0,0 +1,77 @@ +import TextAnimation from '@/components/ui/TextAnimation'; +import ScrollReveal from '@/components/ui/ScrollReveal'; +import Button from '@/components/ui/Button'; +import Tag from '@/components/ui/Tag'; +import { Check } from 'lucide-react'; + +export default function MembershipSection() { + const plans = [ + { + tag: "Individual", + price: "$150/mo", + description: "Perfect for individuals looking to play regularly and join club events.", + features: ["Unlimited court access", "7-day advance booking", "Access to club tournaments", "10% off pro shop"], + }, + { + tag: "Family", + price: "$250/mo", + description: "Great for couples or families who want to enjoy the club together.", + features: ["Unlimited court access for 2 adults and children", "7-day advance booking", "Access to family events", "15% off pro shop"], + }, + { + tag: "Pro", + price: "$300/mo", + description: "For the serious player who wants access to premium coaching and facilities.", + features: ["All Individual benefits", "14-day advance booking", "2 private lessons per month", "Complimentary locker"], + }, + ]; + + return ( +
+
+
+ + +

+ Choose the membership that fits your lifestyle. Enjoy unlimited court access, priority booking, and exclusive member events. +

+
+ +
+ {plans.map((plan, index) => ( + +
+
+ + {plan.tag} + +
{plan.price}
+

{plan.description}

+
+ +
+
    + {plan.features.map((feature, fIndex) => ( +
  • + + {feature} +
    • + ))} +
+
+ +
+ + ))} +
+
+
+ ); +} \ No newline at end of file diff --git a/src/pages/HomePage/sections/Menu.tsx b/src/pages/HomePage/sections/Menu.tsx new file mode 100644 index 0000000..c64d986 --- /dev/null +++ b/src/pages/HomePage/sections/Menu.tsx @@ -0,0 +1,20 @@ +// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this +// file as the canonical source for the "menu" section. + +import React from 'react'; +import FeaturesFilterGrid from "@/components/sections/features/FeaturesFilterGrid"; + +export default function MenuSection(): React.JSX.Element { + return ( + + ); +}