Compare commits
7 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 97b46afe51 | |||
| 0fc4d9a549 | |||
| 8e1d660dbc | |||
| 05041ba4dc | |||
| 15a66e5b5b | |||
| 66aa3242e3 | |||
| b1520c053e |
179
src/app/page.tsx
179
src/app/page.tsx
@@ -2,14 +2,15 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import { Sparkles, CheckCircle, ShieldCheck } from "lucide-react";
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
|
||||
import MediaAbout from '@/components/sections/about/MediaAbout';
|
||||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
|
||||
import TextAbout from '@/components/sections/about/TextAbout';
|
||||
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
||||
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
||||
|
||||
const handleBookNow = () => {
|
||||
const element = document.getElementById('contact');
|
||||
@@ -36,163 +37,103 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "Services", id: "services"},
|
||||
{
|
||||
name: "Trust", id: "why"},
|
||||
{
|
||||
name: "Reviews", id: "testimonials"},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Reviews", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
brandName="House Of Shine"
|
||||
button={{
|
||||
text: "Book Now", onClick: handleBookNow,
|
||||
}}
|
||||
button={{ text: "Book Now", onClick: handleBookNow }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{
|
||||
variant: "plain"}}
|
||||
<HeroBillboardRotatedCarousel
|
||||
title="House Of Shine Autoworks"
|
||||
description="Not the cheapest. The best. We provide showroom-quality transformations for the most discerning automotive enthusiasts."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment", onClick: handleBookNow,
|
||||
},
|
||||
{
|
||||
text: "Get A Quote", onClick: handleBookNow,
|
||||
},
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
buttons={[{ text: "Book Appointment", onClick: handleBookNow }]}
|
||||
carouselItems={[
|
||||
{ id: "c1", imageSrc: "http://img.b2bpic.net/free-photo/headlight-lamp-car_1339-3081.jpg", imageAlt: "Headlight" },
|
||||
{ id: "c2", imageSrc: "http://img.b2bpic.net/free-photo/man-working-car-detailing-coating-car_1303-30600.jpg?_wi=1", imageAlt: "Detailing" },
|
||||
{ id: "c3", imageSrc: "http://img.b2bpic.net/free-photo/view-3d-car-interior_23-2151138882.jpg?_wi=1", imageAlt: "Interior" },
|
||||
{ id: "c4", imageSrc: "http://img.b2bpic.net/free-photo/luxury-car-service_1303-1025.jpg", imageAlt: "Car" },
|
||||
{ id: "c5", imageSrc: "http://img.b2bpic.net/free-photo/car-polishing-man-working-shop_1339-3064.jpg", imageAlt: "Polishing" },
|
||||
{ id: "c6", imageSrc: "http://img.b2bpic.net/free-photo/detailing-car-surface-cleaner_1339-3080.jpg", imageAlt: "Cleaning" }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/headlight-lamp-car_1339-3081.jpg"
|
||||
imageAlt="Luxury car with high gloss finish"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="trust" data-section="trust">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1", value: "5.0", description: "Star Google Rating"},
|
||||
{
|
||||
id: "m2", value: "134+", description: "Happy Clients"},
|
||||
{
|
||||
id: "m3", value: "100%", description: "Satisfaction Guarantee"},
|
||||
]}
|
||||
<MetricCardThree
|
||||
title="Elite Standards"
|
||||
description="Unrivaled expertise for your luxury investment."
|
||||
textboxLayout="split"
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "m1", icon: CheckCircle, title: "Satisfaction", value: "100%" },
|
||||
{ id: "m2", icon: ShieldCheck, title: "Coating Quality", value: "Elite" },
|
||||
{ id: "m3", icon: Sparkles, title: "Transformations", value: "134+" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwentySeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1", title: "Ceramic Coating", descriptions: [
|
||||
"Flagship protection for years of shine.", "Hydrophobic layer for easier maintenance."],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/bubbling-blue-water_23-2147798200.jpg"},
|
||||
{
|
||||
id: "f2", title: "Paint Correction", descriptions: [
|
||||
"Remove swirl marks and light scratches.", "Restore true color intensity and clarity."],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-working-car-detailing-coating-car_1303-30600.jpg"},
|
||||
{
|
||||
id: "f3", title: "Interior Detailing", descriptions: [
|
||||
"Immaculate restoration of all surfaces.", "Deep cleaning with premium leather care."],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-3d-car-interior_23-2151138882.jpg"},
|
||||
]}
|
||||
title="Premium Services"
|
||||
description="Excellence in every detail, from paint protection to full interior restoration."
|
||||
textboxLayout="split"
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: "f1", title: "Ceramic Coating", descriptions: ["Flagship protection for years of shine.", "Hydrophobic layer for easier maintenance."], imageSrc: "http://img.b2bpic.net/free-photo/bubbling-blue-water_23-2147798200.jpg" },
|
||||
{ id: "f2", title: "Paint Correction", descriptions: ["Remove swirl marks and light scratches.", "Restore true color intensity and clarity."], imageSrc: "http://img.b2bpic.net/free-photo/man-working-car-detailing-coating-car_1303-30600.jpg?_wi=2" },
|
||||
{ id: "f3", title: "Interior Detailing", descriptions: ["Immaculate restoration of all surfaces.", "Deep cleaning with premium leather care."], imageSrc: "http://img.b2bpic.net/free-photo/view-3d-car-interior_23-2151138882.jpg?_wi=2" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="why" data-section="why">
|
||||
<MediaAbout
|
||||
useInvertedBackground={false}
|
||||
<TextAbout
|
||||
title="The Detail-Obsessed Difference"
|
||||
description="At House Of Shine, we don't just wash cars; we curate perfection. Jim's passion for automotive excellence ensures every vehicle receives unmatched attention to detail and care."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Our Team", onClick: handleBookNow,
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/beautiful-small-girl-is-sitting-lifting-platform-with-car-holding-hammer_613910-17072.jpg"
|
||||
imageAlt="Jim working on a luxury car"
|
||||
tag="Our Philosophy"
|
||||
useInvertedBackground={false}
|
||||
buttons={[{ text: "Get In Touch", onClick: handleBookNow }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFifteen
|
||||
<TestimonialCardTwelve
|
||||
cardTitle="Client Success Stories"
|
||||
cardTag="Testimonials"
|
||||
cardAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
testimonial="My car looked better than the day I bought it. The ceramic coating is flawless, and the attention to detail is truly unmatched. Jim treats your vehicle like his own."
|
||||
rating={5}
|
||||
author="Sarah Miller"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/beautiful-woman-with-phone-car-showroom_1303-21397.jpg", alt: "Customer 1"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/man-checking-out-new-car_23-2148130139.jpg", alt: "Customer 2"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-man-close-up-hard-light_1321-496.jpg", alt: "Customer 3"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/happy-young-woman-having-fun-amusement-park_23-2147911674.jpg", alt: "Customer 4"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/car-detailing-concept-man-face-mask-with-orbital-polisher-repair-shop-polishing-orange-suv-car_627829-12604.jpg", alt: "Customer 5"},
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Sarah Miller", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-with-phone-car-showroom_1303-21397.jpg" },
|
||||
{ id: "t2", name: "James Smith", imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-close-up-hard-light_1321-496.jpg" }
|
||||
]}
|
||||
ratingAnimation="slide-up"
|
||||
avatarsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
<ContactSplit
|
||||
tag="Contact Us"
|
||||
title="Secure Your Spot"
|
||||
description="Limited openings available for our premium detailing services. Secure your spot today to experience the House Of Shine difference."
|
||||
background={{ variant: "gradient-bars" }}
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "rotated-rays-animated-grid"}}
|
||||
text="Limited openings available for our premium detailing services. Secure your spot today to experience the House Of Shine difference."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Now", onClick: handleBookNow,
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/car-detailing-concept-man-face-mask-with-orbital-polisher-repair-shop-polishing-orange-suv-car_627829-12604.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
<FooterLogoEmphasis
|
||||
logoText="House Of Shine"
|
||||
columns={[
|
||||
{
|
||||
title: "House Of Shine", items: [
|
||||
{
|
||||
label: "About Us", href: "#why"},
|
||||
{
|
||||
label: "Services", href: "#services"},
|
||||
{
|
||||
label: "Testimonials", href: "#testimonials"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support", items: [
|
||||
{
|
||||
label: "Contact Jim", onClick: handleBookNow,
|
||||
},
|
||||
{
|
||||
label: "FAQ", href: "#"},
|
||||
{
|
||||
label: "Privacy Policy", href: "#"},
|
||||
],
|
||||
},
|
||||
{ items: [{ label: "About" }, { label: "Services" }, { label: "Testimonials" }] },
|
||||
{ items: [{ label: "FAQ" }, { label: "Terms" }] }
|
||||
]}
|
||||
bottomLeftText="© 2024 House Of Shine Autoworks."
|
||||
bottomRightText="All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
|
||||
Reference in New Issue
Block a user