368 lines
11 KiB
TypeScript
368 lines
11 KiB
TypeScript
"use client";
|
||
|
||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||
import ReactLenis from "lenis/react";
|
||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
||
import FeatureBento from '@/components/sections/feature/FeatureBento';
|
||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||
import HeroSplit from '@/components/sections/hero/HeroSplit';
|
||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
||
import SplitAbout from '@/components/sections/about/SplitAbout';
|
||
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
||
import { Award, Clock, Leaf } from "lucide-react";
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant="expand-hover"
|
||
defaultTextAnimation="reveal-blur"
|
||
borderRadius="soft"
|
||
contentWidth="mediumLarge"
|
||
sizing="largeSmallSizeLargeTitles"
|
||
background="noiseDiagonalGradient"
|
||
cardStyle="glass-depth"
|
||
primaryButtonStyle="double-inset"
|
||
secondaryButtonStyle="radial-glow"
|
||
headingFontWeight="normal"
|
||
>
|
||
<ReactLenis root>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarLayoutFloatingOverlay
|
||
navItems={[
|
||
{
|
||
name: "Menu",
|
||
id: "menu",
|
||
},
|
||
{
|
||
name: "About",
|
||
id: "about",
|
||
},
|
||
{
|
||
name: "Locations",
|
||
id: "locations",
|
||
},
|
||
]}
|
||
brandName="KFC"
|
||
/>
|
||
</div>
|
||
|
||
<div id="hero" data-section="hero">
|
||
<HeroSplit
|
||
background={{
|
||
variant: "gradient-bars",
|
||
}}
|
||
title="It's Finger Lickin' Good"
|
||
description="The original recipe experience you know and love. Crispy, golden, and always fresh."
|
||
buttons={[
|
||
{
|
||
text: "Order Online",
|
||
href: "#",
|
||
},
|
||
{
|
||
text: "Find a Store",
|
||
href: "#",
|
||
},
|
||
]}
|
||
imageSrc="http://img.b2bpic.net/free-photo/top-view-chicken-with-copy-space_23-2148454892.jpg?_wi=1"
|
||
imageAlt="KFC Original Recipe Bucket"
|
||
mediaAnimation="slide-up"
|
||
avatars={[
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/front-view-young-female-holding-potato-chips-while-watching-movie-light-white-surface_140725-69952.jpg",
|
||
alt: "Customer 1",
|
||
},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/front-view-young-female-holding-basket-with-potato-chips-blue-desk_140725-69574.jpg",
|
||
alt: "Customer 2",
|
||
},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/front-view-young-female-holding-basket-with-chips-posing-white-surface_140725-69509.jpg",
|
||
alt: "Customer 3",
|
||
},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/front-view-young-female-holding-package-with-chips-blue-surface_140725-69707.jpg",
|
||
alt: "Customer 4",
|
||
},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/side-view-man-eating-burger-outdoors_23-2148718885.jpg",
|
||
alt: "Customer 5",
|
||
},
|
||
]}
|
||
avatarText="Join 100,000+ happy fans"
|
||
marqueeItems={[
|
||
{
|
||
type: "text",
|
||
text: "11 Herbs & Spices",
|
||
},
|
||
{
|
||
type: "text",
|
||
text: "Hand-Breaded Daily",
|
||
},
|
||
{
|
||
type: "text",
|
||
text: "Always Fresh Chicken",
|
||
},
|
||
{
|
||
type: "text",
|
||
text: "Golden Crisp Finish",
|
||
},
|
||
{
|
||
type: "text",
|
||
text: "Finger Lickin' Good",
|
||
},
|
||
]}
|
||
/>
|
||
</div>
|
||
|
||
<div id="about" data-section="about">
|
||
<SplitAbout
|
||
textboxLayout="split"
|
||
useInvertedBackground={false}
|
||
title="The Secret Recipe"
|
||
description="Hand-breaded with the Colonel’s secret blend of 11 herbs and spices since 1952."
|
||
bulletPoints={[
|
||
{
|
||
title: "Fresh Ingredients",
|
||
description: "Locally sourced chicken, never frozen.",
|
||
},
|
||
{
|
||
title: "Original Recipe",
|
||
description: "Authentic secret blend of 11 spices.",
|
||
},
|
||
{
|
||
title: "Golden Crisp",
|
||
description: "Perfected pressure-frying technique.",
|
||
},
|
||
]}
|
||
imageSrc="http://img.b2bpic.net/free-photo/chicken-nuggets-with-potatoes-sauces-with-notebook-aside_114579-19744.jpg?_wi=1"
|
||
imageAlt="Colonel Sanders heritage chicken"
|
||
mediaAnimation="blur-reveal"
|
||
/>
|
||
</div>
|
||
|
||
<div id="menu" data-section="menu">
|
||
<ProductCardOne
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
gridVariant="uniform-all-items-equal"
|
||
useInvertedBackground={true}
|
||
products={[
|
||
{
|
||
id: "p1",
|
||
name: "Original Bucket",
|
||
price: "$24.99",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/fried-chicken-leg_1203-7066.jpg",
|
||
},
|
||
{
|
||
id: "p2",
|
||
name: "Crispy Fillet Burger",
|
||
price: "$7.99",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/tasty-burger-with-onion-sauces_23-2148374930.jpg",
|
||
},
|
||
{
|
||
id: "p3",
|
||
name: "Hot Wings Basket",
|
||
price: "$9.49",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/fried-crispy-chicken-wing_74190-514.jpg",
|
||
},
|
||
{
|
||
id: "p4",
|
||
name: "Mashed Potato Bowl",
|
||
price: "$5.99",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/fresh-flavorful-mashed-potatoes_2829-11436.jpg",
|
||
},
|
||
{
|
||
id: "p5",
|
||
name: "Chicken Tenders",
|
||
price: "$8.49",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/grilled-neck-meat-pork-with-spicy-sauce_1203-9139.jpg",
|
||
},
|
||
{
|
||
id: "p6",
|
||
name: "Buttermilk Biscuits",
|
||
price: "$3.99",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/fried-potatoes-with-sausages-cut-into-slices-fried-oil-i_114579-51817.jpg",
|
||
},
|
||
]}
|
||
title="Signature Menu"
|
||
description="Classics that define flavor."
|
||
/>
|
||
</div>
|
||
|
||
<div id="features" data-section="features">
|
||
<FeatureBento
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
features={[
|
||
{
|
||
title: "Fast Pickup",
|
||
description: "Order ahead and grab your meal.",
|
||
bentoComponent: "reveal-icon",
|
||
icon: Clock,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/delicious-corn-dog-meal_52683-86637.jpg",
|
||
imageAlt: "Delicious corn dog meal",
|
||
},
|
||
{
|
||
title: "Loyalty Rewards",
|
||
description: "Earn points on every order.",
|
||
bentoComponent: "reveal-icon",
|
||
icon: Award,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-chicken-with-copy-space_23-2148454892.jpg?_wi=2",
|
||
imageAlt: "Delicious corn dog meal",
|
||
},
|
||
{
|
||
title: "Fresh Every Day",
|
||
description: "Quality you can taste.",
|
||
bentoComponent: "reveal-icon",
|
||
icon: Leaf,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/chicken-nuggets-with-potatoes-sauces-with-notebook-aside_114579-19744.jpg?_wi=2",
|
||
imageAlt: "Delicious corn dog meal",
|
||
},
|
||
]}
|
||
title="Why Choose Us"
|
||
description="Quality meets convenience."
|
||
/>
|
||
</div>
|
||
|
||
<div id="testimonials" data-section="testimonials">
|
||
<TestimonialCardTwo
|
||
textboxLayout="default"
|
||
useInvertedBackground={true}
|
||
testimonials={[
|
||
{
|
||
id: "1",
|
||
name: "Sarah J.",
|
||
role: "Foodie",
|
||
testimonial: "Nothing beats the original recipe!",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-female-holding-basket-with-chips-blue-surface_140725-69491.jpg",
|
||
},
|
||
{
|
||
id: "2",
|
||
name: "Mike D.",
|
||
role: "Regular",
|
||
testimonial: "Always crispy and consistent.",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-indian-man-sitting-fast-food-cafe-eating-hamburger_627829-13283.jpg",
|
||
},
|
||
{
|
||
id: "3",
|
||
name: "Elena R.",
|
||
role: "Parent",
|
||
testimonial: "The whole family loves the bucket.",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/friends-having-crowded-party-home_23-2149203591.jpg",
|
||
},
|
||
{
|
||
id: "4",
|
||
name: "David K.",
|
||
role: "Student",
|
||
testimonial: "Best comfort food around.",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/man-dipping-chicken-nugget-into-sweet-chili-sauce_140725-7031.jpg",
|
||
},
|
||
{
|
||
id: "5",
|
||
name: "Chloe B.",
|
||
role: "Diner",
|
||
testimonial: "So tasty and affordable.",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/excited-young-female-gardener-uniform-wearing-gardening-hat-holding-pumpkin-isolated-orange-wall-with-copy-space_141793-93670.jpg",
|
||
},
|
||
]}
|
||
title="Loved by Fans"
|
||
description="What our guests say."
|
||
/>
|
||
</div>
|
||
|
||
<div id="faq" data-section="faq">
|
||
<FaqSplitText
|
||
useInvertedBackground={false}
|
||
faqs={[
|
||
{
|
||
id: "f1",
|
||
title: "Do you offer delivery?",
|
||
content: "Yes, through our official app.",
|
||
},
|
||
{
|
||
id: "f2",
|
||
title: "Are ingredients fresh?",
|
||
content: "We use fresh chicken every day.",
|
||
},
|
||
{
|
||
id: "f3",
|
||
title: "Can I customize orders?",
|
||
content: "Yes, via the ordering menu.",
|
||
},
|
||
]}
|
||
sideTitle="Common Questions"
|
||
faqsAnimation="slide-up"
|
||
/>
|
||
</div>
|
||
|
||
<div id="contact" data-section="contact">
|
||
<ContactSplitForm
|
||
useInvertedBackground={true}
|
||
title="Get in Touch"
|
||
description="Have a question about our menu?"
|
||
inputs={[
|
||
{
|
||
name: "name",
|
||
type: "text",
|
||
placeholder: "Your Name",
|
||
required: true,
|
||
},
|
||
{
|
||
name: "email",
|
||
type: "email",
|
||
placeholder: "Email Address",
|
||
required: true,
|
||
},
|
||
]}
|
||
textarea={{
|
||
name: "message",
|
||
placeholder: "How can we help?",
|
||
rows: 4,
|
||
required: true,
|
||
}}
|
||
imageSrc="http://img.b2bpic.net/free-photo/vertical-shot-delicious-burger-some-french-fries-glass-cocktail-table_181624-23874.jpg"
|
||
/>
|
||
</div>
|
||
|
||
<div id="footer" data-section="footer">
|
||
<FooterMedia
|
||
imageSrc="http://img.b2bpic.net/free-vector/food-drink-hand-drawn-flat-spicy-chicken-logo_23-2149632244.jpg"
|
||
logoText="KFC"
|
||
columns={[
|
||
{
|
||
title: "Company",
|
||
items: [
|
||
{
|
||
label: "About",
|
||
href: "#about",
|
||
},
|
||
{
|
||
label: "Careers",
|
||
href: "#",
|
||
},
|
||
],
|
||
},
|
||
{
|
||
title: "Support",
|
||
items: [
|
||
{
|
||
label: "Contact",
|
||
href: "#",
|
||
},
|
||
{
|
||
label: "FAQ",
|
||
href: "#",
|
||
},
|
||
],
|
||
},
|
||
]}
|
||
/>
|
||
</div>
|
||
</ReactLenis>
|
||
</ThemeProvider>
|
||
);
|
||
}
|