Merge version_3 into main #2
207
src/app/page.tsx
207
src/app/page.tsx
@@ -18,41 +18,31 @@ export default function LandingPage() {
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="rounded"
|
||||
borderRadius="pill"
|
||||
contentWidth="mediumSmall"
|
||||
sizing="largeSmall"
|
||||
sizing="mediumLargeSizeLargeTitles"
|
||||
background="fluid"
|
||||
cardStyle="inset"
|
||||
primaryButtonStyle="diagonal-gradient"
|
||||
secondaryButtonStyle="layered"
|
||||
headingFontWeight="semibold"
|
||||
cardStyle="glass-depth"
|
||||
primaryButtonStyle="primary-glow"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="extrabold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "#hero",
|
||||
},
|
||||
name: "Home", id: "#hero"},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
name: "About", id: "#about"},
|
||||
{
|
||||
name: "Services",
|
||||
id: "#services",
|
||||
},
|
||||
name: "Services", id: "#services"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
name: "Contact", id: "#contact"},
|
||||
]}
|
||||
brandName="Sky Construction"
|
||||
button={{
|
||||
text: "Get Estimate",
|
||||
href: "#contact",
|
||||
}}
|
||||
text: "Get Estimate", href: "#contact"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -63,37 +53,23 @@ export default function LandingPage() {
|
||||
tag="Sky Construction GC LLC"
|
||||
buttons={[
|
||||
{
|
||||
text: "Request Free Estimate",
|
||||
href: "#contact",
|
||||
},
|
||||
text: "Request Free Estimate", href: "#contact"},
|
||||
{
|
||||
text: "View Services",
|
||||
href: "#services",
|
||||
},
|
||||
text: "View Services", href: "#services"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/attentiveness-businesswoman-with-long-blond-hair-safety-helmet-looking-closely-document-standing-construction-site-working-group_259150-57757.jpg?_wi=1"
|
||||
showDimOverlay={true}
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/businessman-wearing-coat_1098-3778.jpg",
|
||||
alt: "Satisfied client",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/businessman-wearing-coat_1098-3778.jpg", alt: "Satisfied client"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-optimistic-businessman-formalwear_1262-3600.jpg",
|
||||
alt: "Satisfied client",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-optimistic-businessman-formalwear_1262-3600.jpg", alt: "Satisfied client"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/smiling-businessman-standing-airport_107420-85035.jpg",
|
||||
alt: "Satisfied client",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/smiling-businessman-standing-airport_107420-85035.jpg", alt: "Satisfied client"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/medium-shot-business-man-with-backpack_23-2149915912.jpg",
|
||||
alt: "Satisfied client",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/medium-shot-business-man-with-backpack_23-2149915912.jpg", alt: "Satisfied client"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/front-view-cute-girl-looking-away_23-2148436134.jpg",
|
||||
alt: "Satisfied client",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/front-view-cute-girl-looking-away_23-2148436134.jpg", alt: "Satisfied client"},
|
||||
]}
|
||||
avatarText="Trusted by 500+ local property owners"
|
||||
/>
|
||||
@@ -101,7 +77,7 @@ export default function LandingPage() {
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
useInvertedBackground={true}
|
||||
tag="Our Mission"
|
||||
title="Craftsmanship That Protects & Elevates."
|
||||
description="Sky Construction GC LLC was built on one mission: deliver exceptional exterior construction work with integrity, precision, and pride."
|
||||
@@ -119,44 +95,20 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "s1",
|
||||
label: "01",
|
||||
title: "Stucco & Dryvit Restoration",
|
||||
items: [
|
||||
"Luxury-grade stucco repair",
|
||||
"Dryvit restoration",
|
||||
"Seamless refinishing",
|
||||
],
|
||||
id: "s1", label: "01", title: "Stucco & Dryvit Restoration", items: [
|
||||
"Luxury-grade stucco repair", "Dryvit restoration", "Seamless refinishing"],
|
||||
},
|
||||
{
|
||||
id: "s2",
|
||||
label: "02",
|
||||
title: "Chimney & Masonry",
|
||||
items: [
|
||||
"Precision chimney rebuilding",
|
||||
"Masonry restoration",
|
||||
"Weatherproofing",
|
||||
],
|
||||
id: "s2", label: "02", title: "Chimney & Masonry", items: [
|
||||
"Precision chimney rebuilding", "Masonry restoration", "Weatherproofing"],
|
||||
},
|
||||
{
|
||||
id: "s3",
|
||||
label: "03",
|
||||
title: "Exterior Renovations",
|
||||
items: [
|
||||
"High-end siding installation",
|
||||
"Professional exterior painting",
|
||||
"Property value upgrades",
|
||||
],
|
||||
id: "s3", label: "03", title: "Exterior Renovations", items: [
|
||||
"High-end siding installation", "Professional exterior painting", "Property value upgrades"],
|
||||
},
|
||||
{
|
||||
id: "s4",
|
||||
label: "04",
|
||||
title: "Commercial & Residential",
|
||||
items: [
|
||||
"Office building restoration",
|
||||
"Historic home care",
|
||||
"Modern exterior finishing",
|
||||
],
|
||||
id: "s4", label: "04", title: "Commercial & Residential", items: [
|
||||
"Office building restoration", "Historic home care", "Modern exterior finishing"],
|
||||
},
|
||||
]}
|
||||
title="Premium Exterior Construction Services."
|
||||
@@ -167,63 +119,18 @@ export default function LandingPage() {
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "C. Niles",
|
||||
date: "2023",
|
||||
title: "Business Owner",
|
||||
quote: "Beautifully repaired and painted an office building. The building now looks essentially brand new.",
|
||||
tag: "Commercial",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-confident-businessman_107420-84879.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/attentiveness-businesswoman-with-long-blond-hair-safety-helmet-looking-closely-document-standing-construction-site-working-group_259150-57757.jpg?_wi=2",
|
||||
imageAlt: "person portrait office setting",
|
||||
},
|
||||
id: "t1", name: "C. Niles", date: "2023", title: "Business Owner", quote: "Beautifully repaired and painted an office building. The building now looks essentially brand new.", tag: "Commercial", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-confident-businessman_107420-84879.jpg", imageSrc: "http://img.b2bpic.net/free-photo/attentiveness-businesswoman-with-long-blond-hair-safety-helmet-looking-closely-document-standing-construction-site-working-group_259150-57757.jpg?_wi=2", imageAlt: "person portrait office setting"},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Joseph Kozlovsky",
|
||||
date: "2023",
|
||||
title: "Homeowner",
|
||||
quote: "Amazing work. Jerry and his team are very educated, kind, and respectful.",
|
||||
tag: "Residential",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/expressive-senior-female-posing-indoor_344912-358.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-african-american-worker-standing-with-plan-factory_1303-30604.jpg?_wi=2",
|
||||
imageAlt: "person portrait office setting",
|
||||
},
|
||||
id: "t2", name: "Joseph Kozlovsky", date: "2023", title: "Homeowner", quote: "Amazing work. Jerry and his team are very educated, kind, and respectful.", tag: "Residential", avatarSrc: "http://img.b2bpic.net/free-photo/expressive-senior-female-posing-indoor_344912-358.jpg", imageSrc: "http://img.b2bpic.net/free-photo/woman-african-american-worker-standing-with-plan-factory_1303-30604.jpg?_wi=2", imageAlt: "person portrait office setting"},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Mary Ann Moretta",
|
||||
date: "2023",
|
||||
title: "Homeowner",
|
||||
quote: "Sky Construction restored our stucco beautifully and preserved the character of our 1930 home.",
|
||||
tag: "Historical",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/beautiful-mature-woman-having-fun-time_23-2149232840.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-experienced-carpenter-his-younger-employee_329181-15602.jpg",
|
||||
imageAlt: "person portrait office setting",
|
||||
},
|
||||
id: "t3", name: "Mary Ann Moretta", date: "2023", title: "Homeowner", quote: "Sky Construction restored our stucco beautifully and preserved the character of our 1930 home.", tag: "Historical", avatarSrc: "http://img.b2bpic.net/free-photo/beautiful-mature-woman-having-fun-time_23-2149232840.jpg", imageSrc: "http://img.b2bpic.net/free-photo/close-up-experienced-carpenter-his-younger-employee_329181-15602.jpg", imageAlt: "person portrait office setting"},
|
||||
{
|
||||
id: "t4",
|
||||
name: "John Doe",
|
||||
date: "2022",
|
||||
title: "Project Manager",
|
||||
quote: "Highly recommended for high-quality professional work done right the first time.",
|
||||
tag: "Professional",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/close-up-handsome-bearded-guy-showing-okay-gesture-smiling-standing-blue-background_1258-160947.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-engineers-working_23-2151657911.jpg",
|
||||
imageAlt: "person portrait office setting",
|
||||
},
|
||||
id: "t4", name: "John Doe", date: "2022", title: "Project Manager", quote: "Highly recommended for high-quality professional work done right the first time.", tag: "Professional", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-handsome-bearded-guy-showing-okay-gesture-smiling-standing-blue-background_1258-160947.jpg", imageSrc: "http://img.b2bpic.net/free-photo/female-engineers-working_23-2151657911.jpg", imageAlt: "person portrait office setting"},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Sarah Smith",
|
||||
date: "2022",
|
||||
title: "Architect",
|
||||
quote: "The attention to detail in their masonry work is unmatched in the industry today.",
|
||||
tag: "Consulting",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/side-view-old-man-with-laptop-outdoors_23-2148269386.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/building-construction-worker-site-with-architect_23-2149124313.jpg",
|
||||
imageAlt: "person portrait office setting",
|
||||
},
|
||||
id: "t5", name: "Sarah Smith", date: "2022", title: "Architect", quote: "The attention to detail in their masonry work is unmatched in the industry today.", tag: "Consulting", avatarSrc: "http://img.b2bpic.net/free-photo/side-view-old-man-with-laptop-outdoors_23-2148269386.jpg", imageSrc: "http://img.b2bpic.net/free-photo/building-construction-worker-site-with-architect_23-2149124313.jpg", imageAlt: "person portrait office setting"},
|
||||
]}
|
||||
title="Trusted By Our Clients"
|
||||
description="See why homeowners and commercial businesses choose our craftsmanship."
|
||||
@@ -237,25 +144,13 @@ export default function LandingPage() {
|
||||
tag="Our Growth"
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "4.7★",
|
||||
description: "Google Rating",
|
||||
},
|
||||
id: "m1", value: "4.7★", description: "Google Rating"},
|
||||
{
|
||||
id: "m2",
|
||||
value: "14+",
|
||||
description: "Verified Reviews",
|
||||
},
|
||||
id: "m2", value: "14+", description: "Verified Reviews"},
|
||||
{
|
||||
id: "m3",
|
||||
value: "100%",
|
||||
description: "Craftsmanship Focus",
|
||||
},
|
||||
id: "m3", value: "100%", description: "Craftsmanship Focus"},
|
||||
{
|
||||
id: "m4",
|
||||
value: "10+",
|
||||
description: "Years Experience",
|
||||
},
|
||||
id: "m4", value: "10+", description: "Years Experience"},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -263,23 +158,14 @@ export default function LandingPage() {
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Do you provide estimates?",
|
||||
content: "Yes, we provide free estimates for all exterior restoration projects.",
|
||||
},
|
||||
id: "f1", title: "Do you provide estimates?", content: "Yes, we provide free estimates for all exterior restoration projects."},
|
||||
{
|
||||
id: "f2",
|
||||
title: "What areas do you serve?",
|
||||
content: "We serve both residential and commercial clients in the region.",
|
||||
},
|
||||
id: "f2", title: "What areas do you serve?", content: "We serve both residential and commercial clients in the region."},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Do you handle historic homes?",
|
||||
content: "Absolutely, we specialize in preserving character during restoration.",
|
||||
},
|
||||
id: "f3", title: "Do you handle historic homes?", content: "Absolutely, we specialize in preserving character during restoration."},
|
||||
]}
|
||||
sideTitle="Questions?"
|
||||
sideDescription="Find answers to our common service queries."
|
||||
@@ -291,8 +177,7 @@ export default function LandingPage() {
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
variant: "sparkles-gradient"}}
|
||||
tag="Contact Us"
|
||||
title="Bring Your Property Back To Life."
|
||||
description="Schedule your free estimate with our experts today."
|
||||
@@ -303,13 +188,9 @@ export default function LandingPage() {
|
||||
<FooterLogoReveal
|
||||
logoText="Sky Construction"
|
||||
leftLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
text: "Privacy Policy", href: "#"}}
|
||||
rightLink={{
|
||||
text: "Terms of Service",
|
||||
href: "#",
|
||||
}}
|
||||
text: "Terms of Service", href: "#"}}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
|
||||
@@ -11,7 +11,7 @@ html {
|
||||
body {
|
||||
background-color: var(--background);
|
||||
color: var(--foreground);
|
||||
font-family: var(--font-inter), sans-serif;
|
||||
font-family: var(--font-figtree), sans-serif;
|
||||
position: relative;
|
||||
min-height: 100vh;
|
||||
overscroll-behavior: none;
|
||||
@@ -24,5 +24,5 @@ h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: var(--font-dm-sans), sans-serif;
|
||||
font-family: var(--font-figtree), sans-serif;
|
||||
}
|
||||
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #0a0a0a;
|
||||
--card: #1a1a1a;
|
||||
--foreground: #fffffae6;
|
||||
--primary-cta: #fde047;
|
||||
--background: #fbfbfb;
|
||||
--card: #f0f0f0;
|
||||
--foreground: #0a0a0a;
|
||||
--primary-cta: #1a1a1a;
|
||||
--primary-cta-text: #0a0a0a;
|
||||
--secondary-cta: #1a1a1a;
|
||||
--secondary-cta: #e5e5e5;
|
||||
--secondary-cta-text: #fffffae6;
|
||||
--accent: #737373;
|
||||
--background-accent: #737373;
|
||||
--accent: #cccccc;
|
||||
--background-accent: #d4d4d4;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user