132 lines
5.2 KiB
TypeScript
132 lines
5.2 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
|
|
import HeroSplit from "@/components/sections/hero/HeroSplit";
|
|
import TestimonialAboutCard from "@/components/sections/about/TestimonialAboutCard";
|
|
import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
|
|
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
|
|
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
|
|
import { Coffee, Heart, Croissant, Users, Wifi, Menu } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="pill"
|
|
contentWidth="medium"
|
|
sizing="largeSmallSizeLargeTitles"
|
|
background="grid"
|
|
cardStyle="solid"
|
|
primaryButtonStyle="shadow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
brandName="Local Coffee"
|
|
navItems={[
|
|
{ name: "About", id: "about" },
|
|
{ name: "Menu", id: "features" },
|
|
{ name: "Contact", id: "contact" },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplit
|
|
title="Welcome to Local Coffee"
|
|
description="Your neighborhood coffee shop serving fresh, handcrafted coffee and delicious pastries. Stop by today and experience the warmth of great coffee and friendly faces."
|
|
tag="Fresh Daily Brews"
|
|
tagIcon={Coffee}
|
|
tagAnimation="slide-up"
|
|
background={{ variant: "plain" }}
|
|
imageSrc="http://img.b2bpic.net/free-photo/young-woman-eating-croissants-cafe_1303-20409.jpg"
|
|
imageAlt="Freshly brewed coffee in a cafe setting"
|
|
imagePosition="right"
|
|
mediaAnimation="opacity"
|
|
buttons={[
|
|
{ text: "Reserve a Table", href: "contact" },
|
|
{ text: "Learn More", href: "about" },
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TestimonialAboutCard
|
|
tag="Our Story"
|
|
tagIcon={Heart}
|
|
tagAnimation="slide-up"
|
|
title="Where Coffee Lovers Meet"
|
|
description="Maria & James"
|
|
subdescription="Coffee Shop Owners"
|
|
icon={Coffee}
|
|
imageSrc="http://img.b2bpic.net/free-photo/parisian-coffee-shop-style-with-tasty-coffee-served-wooden-table-coffee-shop-design_482257-18283.jpg"
|
|
imageAlt="Warm coffee shop interior with rustic decor"
|
|
mediaAnimation="opacity"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureHoverPattern
|
|
title="What We Offer"
|
|
description="Everything you need for the perfect coffee break"
|
|
tag="Menu"
|
|
tagIcon={Menu}
|
|
tagAnimation="slide-up"
|
|
features={[
|
|
{
|
|
icon: Coffee,
|
|
title: "Premium Coffee", description: "Single-origin beans roasted fresh. From espresso to flat whites, crafted to perfection."},
|
|
{
|
|
icon: Croissant,
|
|
title: "Fresh Pastries", description: "Baked daily by our local baker. Croissants, muffins, and sandwiches."},
|
|
{
|
|
icon: Users,
|
|
title: "Community Space", description: "Comfortable seating perfect for meetings, studying, or catching up with friends."},
|
|
{
|
|
icon: Wifi,
|
|
title: "Free WiFi", description: "Stay connected while you enjoy your favorite drink and a quiet corner."},
|
|
]}
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
title="Get in Touch"
|
|
description="Have questions? Want to reserve a spot for an event? Send us a message and we'll get back to you soon."
|
|
inputs={[
|
|
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
|
{ name: "email", type: "email", placeholder: "Your Email", required: true },
|
|
{ name: "phone", type: "tel", placeholder: "Phone Number", required: false },
|
|
]}
|
|
textarea={{
|
|
name: "message", placeholder: "Tell us what's on your mind...", rows: 4,
|
|
required: true,
|
|
}}
|
|
imageSrc="http://img.b2bpic.net/free-photo/latte-coffee-cup_1203-3394.jpg"
|
|
imageAlt="Cup of coffee with latte art"
|
|
mediaPosition="right"
|
|
mediaAnimation="opacity"
|
|
useInvertedBackground={false}
|
|
buttonText="Send Message"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoReveal
|
|
logoText="Local Coffee"
|
|
leftLink={{ text: "Privacy Policy", href: "#" }}
|
|
rightLink={{ text: "Contact", href: "#contact" }}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|