Compare commits
11 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 3868071ff7 | |||
| 73a15ca80c | |||
| f7b24031e6 | |||
| 477659e77c | |||
| 3197a939dc | |||
| ce2a9da0f4 | |||
| dd699d6339 | |||
| 92949a80a6 | |||
| 5f644fc71f | |||
| 9677910d29 | |||
| d5ce6f3359 |
326
src/app/page.tsx
326
src/app/page.tsx
@@ -2,17 +2,12 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||||
import FaqBase from '@/components/sections/faq/FaqBase';
|
||||
import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
|
||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
|
||||
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
||||
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
||||
import { Award, CheckCircle, Shield } from "lucide-react";
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -32,105 +27,60 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Projects", id: "work" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="C&E Concrete"
|
||||
brandName="C & E Concrete Design INC"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Built to Last: Professional Concrete Solutions"
|
||||
description="C&E Concrete delivers industry-leading precision and durability for residential and commercial projects. From foundations to finished surfaces, we set the standard."
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Quality Concrete Built To Last"
|
||||
description="C & E Concrete Design INC provides superior craftsmanship for all your residential and commercial needs in the Seattle area. Professional, licensed, and insured."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get a Quote",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
text: "Our Services",
|
||||
href: "#services",
|
||||
},
|
||||
{ text: "Get a Free Estimate", href: "#contact" },
|
||||
{ text: "View Our Services", href: "#services" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/shanghai-china-skyscrapers-old-iron-bridge_1127-2881.jpg"
|
||||
imageAlt="Concrete pouring project"
|
||||
imageAlt="Quality concrete project"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="Decades of Concrete Excellence"
|
||||
description="At C&E Concrete, our legacy is built on the foundations we pour. We combine traditional craft with modern technology to ensure every structure stands the test of time and weather."
|
||||
title="Why Choose Us?"
|
||||
description="With over 15 years of experience, C & E Concrete Design INC is the trusted name in the Seattle area for high-quality concrete solutions. We are fully licensed and insured, offering professional expertise for both residential and commercial projects with a commitment to reliability and free estimates."
|
||||
metrics={[
|
||||
{
|
||||
value: "20+",
|
||||
title: "Years Experience",
|
||||
},
|
||||
{
|
||||
value: "1500+",
|
||||
title: "Projects Completed",
|
||||
},
|
||||
{
|
||||
value: "100%",
|
||||
title: "Client Satisfaction",
|
||||
},
|
||||
{ value: "15+", title: "Years Experience" },
|
||||
{ value: "100%", title: "Licensed & Insured" },
|
||||
{ value: "Local", title: "Seattle Experts" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/construction-technicians-are-mixing-cement-stone-sand-construction_1150-15109.jpg"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/construction-technicians-are-mixing-cement-stone-sand-construction_1150-15109.jpg?_wi=1"
|
||||
imageAlt="About C&E Concrete"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyEight
|
||||
<div id="work" data-section="work">
|
||||
<ProductCardFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Durability Focused",
|
||||
subtitle: "High-grade materials for long-lasting results.",
|
||||
category: "Quality",
|
||||
value: "100%",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Expert Precision",
|
||||
subtitle: "Skilled craftsmen ensuring perfectly leveled surfaces.",
|
||||
category: "Service",
|
||||
value: "Top",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Timely Delivery",
|
||||
subtitle: "Projects completed on schedule, every time.",
|
||||
category: "Efficiency",
|
||||
value: "Fast",
|
||||
},
|
||||
title="Recent Projects: Before & After"
|
||||
description="Explore the transformation in our gallery, showcasing our recent custom concrete designs and finished installations."
|
||||
products={[
|
||||
{ id: "p1", name: "Custom Stamped Patio (After)", price: "Ref: 01", variant: "Stamped", imageSrc: "http://img.b2bpic.net/free-photo/outdoors-cobblestone-texture_23-2149432953.jpg" },
|
||||
{ id: "p2", name: "Driveway Transformation (After)", price: "Ref: 02", variant: "Overlay", imageSrc: "http://img.b2bpic.net/free-photo/construction-technicians-are-mixing-cement-stone-sand-construction_1150-15109.jpg?_wi=2" },
|
||||
{ id: "p3", name: "Structural Sidewalk (After)", price: "Ref: 03", variant: "Structural", imageSrc: "http://img.b2bpic.net/free-photo/staircase-concrete_1203-3467.jpg?_wi=1" }
|
||||
]}
|
||||
title="Why Choose C&E Concrete?"
|
||||
description="Reliability meets craftsmanship in every job we undertake."
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -141,216 +91,38 @@ export default function LandingPage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Residential Foundations",
|
||||
price: "Custom Quote",
|
||||
variant: "Standard",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/empty-stone-stairway_1339-6117.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Commercial Slabs",
|
||||
price: "Custom Quote",
|
||||
variant: "Industrial",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/staircase-concrete_1203-3467.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Decorative Driveways",
|
||||
price: "Custom Quote",
|
||||
variant: "Stamped",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/urban-street-with-modern-architecture_23-2147694741.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Concrete Patios",
|
||||
price: "Custom Quote",
|
||||
variant: "Finish",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/outdoors-cobblestone-texture_23-2149432953.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Concrete Walkways",
|
||||
price: "Custom Quote",
|
||||
variant: "Safety",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/tiler-working-renovation-apartment_23-2149278575.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Structural Repair",
|
||||
price: "Custom Quote",
|
||||
variant: "Maintenance",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/excavator-digging-day-light-outdoors_23-2149194769.jpg",
|
||||
},
|
||||
{ id: "s1", name: "Stamped Concrete", price: "Service", variant: "Decorative", imageSrc: "http://img.b2bpic.net/free-photo/empty-stone-stairway_1339-6117.jpg" },
|
||||
{ id: "s2", name: "Driveways & Patios", price: "Service", variant: "Residential", imageSrc: "http://img.b2bpic.net/free-photo/urban-street-with-modern-architecture_23-2147694741.jpg" },
|
||||
{ id: "s3", name: "Sidewalks & Overlays", price: "Service", variant: "Structural", imageSrc: "http://img.b2bpic.net/free-photo/staircase-concrete_1203-3467.jpg?_wi=2" },
|
||||
]}
|
||||
title="Our Specialized Concrete Services"
|
||||
description="We offer a wide range of concrete services to meet your specific construction needs."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
icon: Award,
|
||||
title: "Safety Awards",
|
||||
value: "15",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
icon: CheckCircle,
|
||||
title: "Successful Pours",
|
||||
value: "2000+",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
icon: Shield,
|
||||
title: "Warranty Years",
|
||||
value: "10",
|
||||
},
|
||||
]}
|
||||
title="Performance at a Glance"
|
||||
description="Our concrete results speak for themselves."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah Jenkins",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-architect-using-laptop_23-2148243016.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Mark Thornton",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/architect-doing-okay-sign_1149-1825.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Linda Peterson",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/authentic-scenes-plus-size-males-playing-basketball_23-2150961209.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Robert Clark",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-real-estate-agents-with-scaffold-background_23-2147650204.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Jessica Lee",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/construction-worker-using-mobile-phone-working_329181-3735.jpg",
|
||||
},
|
||||
]}
|
||||
cardTitle="What Our Clients Say"
|
||||
cardTag="Trusted Service"
|
||||
cardAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "How long does a concrete pour take?",
|
||||
content: "The duration depends on project size and weather conditions, but we prioritize efficient schedules.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Do you provide estimates?",
|
||||
content: "Yes, we offer free, no-obligation estimates for all projects.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Are you licensed and insured?",
|
||||
content: "Absolutely, C&E Concrete is fully licensed and insured for your peace of mind.",
|
||||
},
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Clear answers about our concrete solutions."
|
||||
faqsAnimation="slide-up"
|
||||
title="Our Concrete Services"
|
||||
description="We provide custom concrete designs tailored to your unique requirements."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Ready to Start?"
|
||||
title="Let's Lay the Foundation"
|
||||
description="Contact C&E Concrete today for your project consultation."
|
||||
buttons={[
|
||||
{
|
||||
text: "Call Now",
|
||||
href: "tel:5550123",
|
||||
},
|
||||
{
|
||||
text: "Send Email",
|
||||
href: "mailto:info@ceconcrete.com",
|
||||
},
|
||||
]}
|
||||
<ContactSplit
|
||||
tag="Quote Request"
|
||||
title="Start Your Project Today"
|
||||
description="Fill in your details below to request a free quote for your next concrete project. Our team will get back to you shortly."
|
||||
onSubmit={(email) => console.log("Form submitted for: ", email)}
|
||||
background={{ variant: "plain" }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/worker-working-construction-site_1150-15109.jpg"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="C&E Concrete"
|
||||
<FooterLogoEmphasis
|
||||
logoText="C & E Concrete Design INC"
|
||||
columns={[
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "#services",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#faq",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ items: [{ label: "Stamped Concrete", href: "#services" }, { label: "Driveways/Patios", href: "#services" }] },
|
||||
{ items: [{ label: "About Us", href: "#about" }, { label: "Contact", href: "#contact" }] },
|
||||
{ items: [{ label: "Follow on Instagram", href: "https://instagram.com" }] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #f5f4ef;
|
||||
--card: #dad6cd;
|
||||
--foreground: #2a2928;
|
||||
--primary-cta: #2a2928;
|
||||
--primary-cta-text: #f5f4ef;
|
||||
--secondary-cta: #ecebea;
|
||||
--secondary-cta-text: #2a2928;
|
||||
--accent: #ffffff;
|
||||
--background-accent: #c6b180;
|
||||
--background: #0a0a0a;
|
||||
--card: #1a1a1a;
|
||||
--foreground: #f5f5f5;
|
||||
--primary-cta: #ffdf7d;
|
||||
--primary-cta-text: #0a0a0a;
|
||||
--secondary-cta: #1a1a1a;
|
||||
--secondary-cta-text: #ffffff;
|
||||
--accent: #b8860b;
|
||||
--background-accent: #8b6914;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user