Merge version_1 into main
Merge version_1 into main
This commit was merged in pull request #1.
This commit is contained in:
319
src/app/page.tsx
319
src/app/page.tsx
@@ -16,229 +16,118 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Hours",
|
||||
id: "hours",
|
||||
},
|
||||
{
|
||||
name: "Location",
|
||||
id: "location",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Lloyds Barbershop"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Hours", id: "hours" },
|
||||
{ name: "Location", id: "location" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Lloyds Barbershop"
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCentered
|
||||
background={{
|
||||
variant: "downward-rays-static",
|
||||
}}
|
||||
title="Lloyds Barbershop Always Fresh"
|
||||
description="Professional grooming services in the heart of Davenport, Florida. Experience quality cuts and a welcoming atmosphere."
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/stylish-blond-bearded-male-with-crossed-arms-dressed-brown-leather-pilot-jacket_613910-11192.jpg",
|
||||
alt: "Barber 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/redhead-hipster-male-with-long-luxuriant-hair-full-beard-dressed-hoodie-t-shirt-playing-russian-traditional-musical-instrument-gusli-isolated-dark-background_613910-20139.jpg",
|
||||
alt: "Barber 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-bearded-male-with-tattooed-crossed-arms-grey-background_613910-1610.jpg",
|
||||
alt: "Barber 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/front-view-business-man-with-apron_23-2148366567.jpg",
|
||||
alt: "Barber 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/frowning-young-caucasian-male-barber-wearing-glasses-wavy-hair-band-uniform-keeping-hands-crossed-holding-scissors-comb-isolated-white-background-with-copy-space_141793-32123.jpg",
|
||||
alt: "Barber 5",
|
||||
},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Directions",
|
||||
href: "#location",
|
||||
},
|
||||
{
|
||||
text: "Call Now",
|
||||
href: "tel:+13214014358",
|
||||
},
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Classic Cuts",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Beard Trimming",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Hot Towel Shave",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Modern Styles",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Family Friendly",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCentered
|
||||
background={{ variant: "downward-rays-static" }}
|
||||
title="Lloyds Barbershop Always Fresh"
|
||||
description="Professional grooming services in the heart of Davenport, Florida. Experience quality cuts and a welcoming atmosphere."
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/stylish-blond-bearded-male-with-crossed-arms-dressed-brown-leather-pilot-jacket_613910-11192.jpg", alt: "Barber 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/redhead-hipster-male-with-long-luxuriant-hair-full-beard-dressed-hoodie-t-shirt-playing-russian-traditional-musical-instrument-gusli-isolated-dark-background_613910-20139.jpg", alt: "Barber 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-bearded-male-with-tattooed-crossed-arms-grey-background_613910-1610.jpg", alt: "Barber 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/front-view-business-man-with-apron_23-2148366567.jpg", alt: "Barber 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/frowning-young-caucasian-male-barber-wearing-glasses-wavy-hair-band-uniform-keeping-hands-crossed-holding-scissors-comb-isolated-white-background-with-copy-space_141793-32123.jpg", alt: "Barber 5" },
|
||||
]}
|
||||
buttons={[
|
||||
{ text: "Get Directions", href: "#location" },
|
||||
{ text: "Call Now", href: "tel:+13214014358" },
|
||||
]}
|
||||
marqueeItems={[
|
||||
{ type: "text", text: "Classic Cuts" },
|
||||
{ type: "text", text: "Beard Trimming" },
|
||||
{ type: "text", text: "Hot Towel Shave" },
|
||||
{ type: "text", text: "Modern Styles" },
|
||||
{ type: "text", text: "Family Friendly" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hours" data-section="hours">
|
||||
<MediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Opening Hours"
|
||||
description="We are open Monday through Saturday to provide you with the freshest cuts. Sunday: Closed. Mon – Sat: 9:00AM – 7:00PM."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/barber-equipment-working-surface-by-mirror-barbershop_627829-8282.jpg"
|
||||
imageAlt="Barbershop interior"
|
||||
/>
|
||||
</div>
|
||||
<div id="hours" data-section="hours">
|
||||
<MediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Opening Hours"
|
||||
description="We are open Monday through Saturday to provide you with the freshest cuts. Sunday: Closed. Mon – Sat: 9:00AM – 7:00PM."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/barber-equipment-working-surface-by-mirror-barbershop_627829-8282.jpg"
|
||||
imageAlt="Barbershop interior"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="location" data-section="location">
|
||||
<FeatureCardTwelve
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
id: "addr",
|
||||
label: "Address",
|
||||
title: "7561 Osceola Polk Line Rd",
|
||||
items: [
|
||||
"Davenport, FL 33896",
|
||||
"United States",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "phone",
|
||||
label: "Call Us",
|
||||
title: "+1 (321) 401-4358",
|
||||
items: [
|
||||
"Speak with a team member",
|
||||
"Book your appointment today",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "web",
|
||||
label: "Online",
|
||||
title: "Connect",
|
||||
items: [
|
||||
"Facebook Page",
|
||||
"Visit our profile",
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Visit Us"
|
||||
description="Located centrally in Davenport, easy to find and accessible for all your grooming needs."
|
||||
/>
|
||||
</div>
|
||||
<div id="location" data-section="location">
|
||||
<FeatureCardTwelve
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ id: "addr", label: "Address", title: "7561 Osceola Polk Line Rd", items: ["Davenport, FL 33896", "United States"] },
|
||||
{ id: "phone", label: "Call Us", title: "+1 (321) 401-4358", items: ["Speak with a team member", "Book your appointment today"] },
|
||||
{ id: "web", label: "Online", title: "Connect", items: ["Facebook Page", "Visit our profile"] },
|
||||
]}
|
||||
title="Visit Us"
|
||||
description="Located centrally in Davenport, easy to find and accessible for all your grooming needs."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Frequently Asked Questions"
|
||||
description="Common questions about our services and booking process."
|
||||
faqsAnimation="slide-up"
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Do I need an appointment?",
|
||||
content: "We welcome walk-ins, but recommend booking ahead during peak hours.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Are you open on Sundays?",
|
||||
content: "No, we are closed on Sundays to give our team time with their families.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Where are you located?",
|
||||
content: "We are located at 7561 Osceola Polk Line Rd, Davenport, FL.",
|
||||
},
|
||||
{
|
||||
id: "f4",
|
||||
title: "Do you offer beard grooming?",
|
||||
content: "Yes, we specialize in beard maintenance and hot towel shaves.",
|
||||
},
|
||||
{
|
||||
id: "f5",
|
||||
title: "Is parking available?",
|
||||
content: "Yes, there is free parking right in front of our shop.",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Frequently Asked Questions"
|
||||
description="Common questions about our services and booking process."
|
||||
faqsAnimation="slide-up"
|
||||
faqs={[
|
||||
{ id: "f1", title: "Do I need an appointment?", content: "We welcome walk-ins, but recommend booking ahead during peak hours." },
|
||||
{ id: "f2", title: "Are you open on Sundays?", content: "No, we are closed on Sundays to give our team time with their families." },
|
||||
{ id: "f3", title: "Where are you located?", content: "We are located at 7561 Osceola Polk Line Rd, Davenport, FL." },
|
||||
{ id: "f4", title: "Do you offer beard grooming?", content: "Yes, we specialize in beard maintenance and hot towel shaves." },
|
||||
{ id: "f5", title: "Is parking available?", content: "Yes, there is free parking right in front of our shop." },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
text="Ready for a fresh cut? Give us a call or stop by today during our working hours."
|
||||
buttons={[
|
||||
{
|
||||
text: "Call Now",
|
||||
href: "tel:+13214014358",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
text="Ready for a fresh cut? Give us a call or stop by today during our working hours."
|
||||
buttons={[
|
||||
{ text: "Call Now", href: "tel:+13214014358" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
logoText="Lloyds Barbershop"
|
||||
columns={[
|
||||
{
|
||||
title: "Info",
|
||||
items: [
|
||||
{
|
||||
label: "Hours",
|
||||
href: "#hours",
|
||||
},
|
||||
{
|
||||
label: "Location",
|
||||
href: "#location",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Social",
|
||||
items: [
|
||||
{
|
||||
label: "Facebook",
|
||||
href: "https://facebook.com",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2024 Lloyds Barbershop. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
logoText="Lloyds Barbershop"
|
||||
columns={[
|
||||
{ title: "Info", items: [{ label: "Hours", href: "#hours" }, { label: "Location", href: "#location" }] },
|
||||
{ title: "Social", items: [{ label: "Facebook", href: "https://facebook.com" }] },
|
||||
]}
|
||||
copyrightText="© 2024 Lloyds Barbershop. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user