279 lines
12 KiB
TypeScript
279 lines
12 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
|
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
|
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
|
|
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
|
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
|
|
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
|
|
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
|
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
|
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
|
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="shift-hover"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="rounded"
|
|
contentWidth="compact"
|
|
sizing="largeSmallSizeLargeTitles"
|
|
background="floatingGradient"
|
|
cardStyle="soft-shadow"
|
|
primaryButtonStyle="radial-glow"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="extrabold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
navItems={[
|
|
{
|
|
name: "Home", id: "hero"},
|
|
{
|
|
name: "Benefits", id: "benefits"},
|
|
{
|
|
name: "Projects", id: "projects"},
|
|
{
|
|
name: "Quote", id: "quote"},
|
|
]}
|
|
brandName="Solara"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardGallery
|
|
background={{
|
|
variant: "radial-gradient"}}
|
|
title="Power Your Home With the Future of Solar"
|
|
description="Lower your electricity bills and switch to premium solar energy designed for modern California homes."
|
|
buttons={[
|
|
{
|
|
text: "Get Free Solar Quote", href: "#quote"},
|
|
{
|
|
text: "See How It Works", href: "#process"},
|
|
]}
|
|
mediaItems={[
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/texture-swimming-pool-mosaic-tile-background-wallpaper-banner-backdrop_1258-69282.jpg", imageAlt: "Futuristic solar home"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/aerial-view-modern-suburban-housing-estate-gold-coast-hinterland_1308-189300.jpg", imageAlt: "Luxury installation"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-with-robotic-vacuum-cleaner_52683-137244.jpg", imageAlt: "Storage tech"},
|
|
]}
|
|
mediaAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="trust" data-section="trust">
|
|
<MetricCardFourteen
|
|
useInvertedBackground={false}
|
|
title="Why California Trusts Solara"
|
|
tag="Expertise"
|
|
metrics={[
|
|
{
|
|
id: "m1", value: "Licensed", description: "Fully Insured Pros"},
|
|
{
|
|
id: "m2", value: "25-Year", description: "System Warranty"},
|
|
{
|
|
id: "m3", value: "Fast", description: "Seamless Installation"},
|
|
{
|
|
id: "m4", value: "Expert", description: "CA Solar Specialists"},
|
|
]}
|
|
metricsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="benefits" data-section="benefits">
|
|
<FeatureCardNine
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
features={[
|
|
{
|
|
title: "Energy Independence", description: "Break free from grid dependency with our advanced solar configurations.", phoneOne: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/3d-house-model-with-modern-architecture_23-2151004065.jpg"},
|
|
phoneTwo: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/solar-panels-generating-electricity-with-copy-space_23-2148895411.jpg"}
|
|
},
|
|
{
|
|
title: "Lower Electric Bills", description: "Maximize your savings with cutting-edge panel efficiency.", phoneOne: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/energy-storage_1048-2431.jpg"},
|
|
phoneTwo: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/aerial-shot-turaida-castle-sigulda_181624-39097.jpg"}
|
|
},
|
|
{
|
|
title: "Home Value Boost", description: "Increase your property value with premium aesthetic installations.", phoneOne: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/business-person-planning-alternative-energies_23-2149205422.jpg"},
|
|
phoneTwo: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/business-person-planning-alternative-energies_23-2149205439.jpg"}
|
|
},
|
|
{
|
|
title: "Renewable Future", description: "Clean, sustainable energy for a better California future.", phoneOne: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/sustainable-eco-friendly-community-with-wind-turbines-solar-panels_23-2151990787.jpg"},
|
|
phoneTwo: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/digital-modern-thermostat-home_53876-146254.jpg"}
|
|
},
|
|
]}
|
|
showStepNumbers={false}
|
|
title="Future-Proof Your Investment"
|
|
description="Experience superior energy solutions designed for luxury lifestyles."
|
|
/>
|
|
</div>
|
|
|
|
<div id="process" data-section="process">
|
|
<FaqSplitMedia
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "1", title: "1. Free Consultation", content: "Our experts analyze your home's unique energy potential with custom CAD designs."},
|
|
{
|
|
id: "2", title: "2. Custom Solar Design", content: "Receive a tailored solar layout optimized for maximum sunlight exposure."},
|
|
{
|
|
id: "3", title: "3. Installation & Activation", content: "Professional installation and rapid activation to get your home powered."},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/top-view-buildings-swimming-pool_116348-23.jpg"
|
|
title="The Solara Process"
|
|
description="A seamless journey from initial consultation to complete activation."
|
|
faqsAnimation="blur-reveal"
|
|
imageAlt="Solar installation professional"
|
|
mediaAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="storage" data-section="storage">
|
|
<InlineImageSplitTextAbout
|
|
useInvertedBackground={true}
|
|
heading={[
|
|
{
|
|
type: "text", content: "Battery Backup Storage"},
|
|
{
|
|
type: "image", src: "http://img.b2bpic.net/free-photo/engineering-team-photovoltaics-plant-improving-solar-cells-efficiency_482257-120033.jpg", alt: "Tesla Powerwall"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="projects" data-section="projects">
|
|
<ProductCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={true}
|
|
products={[
|
|
{
|
|
id: "p1", name: "Beverly Hills Residence", price: "Solar + Battery", imageSrc: "http://img.b2bpic.net/free-photo/man-with-white-helmet-near-solar-panel_1157-29996.jpg"},
|
|
{
|
|
id: "p2", name: "Santa Monica Estate", price: "Roof Solar", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-eco-plan-arrangement_23-2148920646.jpg"},
|
|
{
|
|
id: "p3", name: "Pasadena Villa", price: "Full System", imageSrc: "http://img.b2bpic.net/free-photo/aerial-shot-cottages-devon-uk_181624-32392.jpg"},
|
|
{
|
|
id: "p4", name: "Glendale Modern", price: "Grid-Tie", imageSrc: "http://img.b2bpic.net/free-photo/bulb-meadow-with-house_1134-163.jpg"},
|
|
{
|
|
id: "p5", name: "LA Smart Home", price: "Premium Solar", imageSrc: "http://img.b2bpic.net/free-photo/modern-country-houses-construction_1385-20.jpg"},
|
|
{
|
|
id: "p6", name: "Pacific Palisades", price: "Battery System", imageSrc: "http://img.b2bpic.net/free-photo/man-with-white-helmet-near-solar-panel_1157-29999.jpg"},
|
|
]}
|
|
title="Premium Solar Installations"
|
|
description="Recent high-end transformations across the California region."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardThirteen
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "t1", name: "Sarah J.", handle: "Beverly Hills", testimonial: "Solara exceeded all expectations. My monthly bill is virtually zero now.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-men-working-with-computer_23-2148920578.jpg"},
|
|
{
|
|
id: "t2", name: "Michael R.", handle: "Santa Monica", testimonial: "The installation was fast and non-intrusive. A premium experience.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/young-man-enjoying-new-technologies_23-2147859141.jpg"},
|
|
{
|
|
id: "t3", name: "Emily P.", handle: "Pasadena", testimonial: "Professional, efficient, and clean. My home value increased immediately.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/colleagues-work-having-lunch_23-2148894059.jpg"},
|
|
{
|
|
id: "t4", name: "David W.", handle: "Glendale", testimonial: "The battery system gives me total peace of mind during outages.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/man-working-project-medium-shot_23-2148920582.jpg"},
|
|
{
|
|
id: "t5", name: "Jessica M.", handle: "Los Angeles", testimonial: "Top-tier service from start to finish. Highly recommended.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/lovely-brunette-browsing-tablet-smiling_23-2147770029.jpg"},
|
|
]}
|
|
showRating={true}
|
|
title="What Our Homeowners Say"
|
|
description="Trusted by hundreds of premium California residents."
|
|
/>
|
|
</div>
|
|
|
|
<div id="quote" data-section="quote">
|
|
<ContactCTA
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "sparkles-gradient"}}
|
|
tag="Instant Quote"
|
|
title="Calculate My Solar Savings"
|
|
description="Enter your details for a free custom solar quote designed for your home."
|
|
buttons={[
|
|
{
|
|
text: "Calculate My Solar Savings", href: "#quote"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="cta-final" data-section="cta-final">
|
|
<ContactCTA
|
|
useInvertedBackground={true}
|
|
background={{
|
|
variant: "radial-gradient"}}
|
|
tag="Take Action"
|
|
title="Ready to Start Saving With Solar?"
|
|
description="Get a free custom solar quote and discover how much your home could save."
|
|
buttons={[
|
|
{
|
|
text: "Claim My Free Solar Estimate", href: "#quote"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseReveal
|
|
logoText="Solara"
|
|
columns={[
|
|
{
|
|
title: "Company", items: [
|
|
{
|
|
label: "Home", href: "#hero"},
|
|
{
|
|
label: "Benefits", href: "#benefits"},
|
|
{
|
|
label: "Projects", href: "#projects"},
|
|
{
|
|
label: "Contact", href: "#cta-final"},
|
|
],
|
|
},
|
|
{
|
|
title: "Service Areas", items: [
|
|
{
|
|
label: "Los Angeles", href: "#"},
|
|
{
|
|
label: "Beverly Hills", href: "#"},
|
|
{
|
|
label: "Santa Monica", href: "#"},
|
|
{
|
|
label: "Glendale", href: "#"},
|
|
{
|
|
label: "Pasadena", href: "#"},
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |