bender/4faeca16-5db4-43c2-bbd0-2b4c98d23698
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

merge into: bender:version_2
Branches Tags
bender:main bender:version_3 bender:version_2 bender:version_1
...
pull from: bender:main
Branches Tags
bender:main bender:version_3 bender:version_2 bender:version_1

7 Commits
version_2 ... main

Author SHA1 Message Date
bender
0f7cebb105 Merge version_3 into main 
Merge version_3 into main
 2026-03-08 05:24:29 +00:00
bender
c534bc699d Update theme colors 2026-03-08 05:24:22 +00:00
bender
d11e75f0c4 Merge version_3 into main 
Merge version_3 into main
 2026-03-08 05:22:40 +00:00
bender
f1f922f00c Update src/app/page.tsx 2026-03-08 05:22:37 +00:00
bender
72ad4abd29 Update src/app/layout.tsx 2026-03-08 05:22:36 +00:00
bender
fc97ca3811 Merge version_2 into main 
Merge version_2 into main
 2026-03-08 05:15:02 +00:00
bender
a1d09d459d Merge version_2 into main 
Merge version_2 into main
 2026-03-08 05:14:10 +00:00
3 changed files with 40 additions and 95 deletions
Expand all files Collapse all files

27
src/app/layout.tsx
View File

@@ -2,12 +2,10 @@ import type { Metadata } from "next";
import { Inter } from "next/font/google"; import { Inter } from "next/font/google";
import "./globals.css"; import "./globals.css";
const inter = Inter({ const inter = Inter({ subsets: ["latin"] });
variable: "--font-inter", subsets: ["latin"],
});
export const metadata: Metadata = { export const metadata: Metadata = {
title: "MG Junk Removal | Professional Service, Transparent Pricing", description: "Fast, reliable junk removal with upfront pricing and zero damage guarantee. Same-day quotes and professional crews."}; title: "MG Junk Removal", description: "Professional junk removal services with transparent pricing and damage-free guarantee."};
export default function RootLayout({ export default function RootLayout({
children, children,
@@ -15,25 +13,8 @@ export default function RootLayout({
children: React.ReactNode; children: React.ReactNode;
}) { }) {
return ( return (
<html lang="en" suppressHydrationWarning> <html lang="en">
<head> <body className={inter.className}>{children}
<script
dangerouslySetInnerHTML={{
__html: `
try {
if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
document.documentElement.classList.add('dark')
} else {
document.documentElement.classList.remove('dark')
}
} catch (e) {}
`,
}}
/>
</head>
<body className={`${inter.variable} antialiased`} suppressHydrationWarning>
{children}
<script <script
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
__html: ` __html: `

92
src/app/page.tsx
View File

@@ -10,55 +10,8 @@ import TestimonialCardFifteen from "@/components/sections/testimonial/Testimonia
import ContactSplit from "@/components/sections/contact/ContactSplit"; import ContactSplit from "@/components/sections/contact/ContactSplit";
import FooterMedia from "@/components/sections/footer/FooterMedia"; import FooterMedia from "@/components/sections/footer/FooterMedia";
import { Truck, CheckCircle, Shield, Award, Clock, Star, Phone } from "lucide-react"; import { Truck, CheckCircle, Shield, Award, Clock, Star, Phone } from "lucide-react";
import { useState } from "react";
export default function LandingPage() { export default function LandingPage() {
const [formData, setFormData] = useState({ email: "", name: "" });
const [submissionStatus, setSubmissionStatus] = useState<"idle" | "loading" | "success" | "error">("idle");
const [confirmationCode, setConfirmationCode] = useState<string | null>(null);
const generateConfirmationCode = (): string => {
return Math.floor(100000 + Math.random() * 900000).toString();
};
const handleQuoteSubmit = async (email: string) => {
setFormData(prev => ({ ...prev, email }));
setSubmissionStatus("loading");
try {
const code = generateConfirmationCode();
setConfirmationCode(code);
// Extract first name from email if not already set
const firstName = formData.name || email.split("@")[0].split(".")[0];
const response = await fetch("https://formspree.io/f/xjkbygyp", {
method: "POST", headers: {
"Accept": "application/json", "Content-Type": "application/json"},
body: JSON.stringify({
email: email,
name: firstName,
message: `Quote Request from ${firstName}. Confirmation Code: ${code}`,
_subject: `MG Junk Removal Quote Request - ${code}`,
}),
});
if (response.ok) {
setSubmissionStatus("success");
// Reset form after 3 seconds
setTimeout(() => {
setFormData({ email: "", name: "" });
setSubmissionStatus("idle");
}, 3000);
} else {
setSubmissionStatus("error");
}
} catch (error) {
console.error("Form submission error:", error);
setSubmissionStatus("error");
}
};
return ( return (
<ThemeProvider <ThemeProvider
defaultButtonVariant="bounce-effect" defaultButtonVariant="bounce-effect"
@@ -105,13 +58,16 @@ export default function LandingPage() {
testimonials={[ testimonials={[
{ {
name: "James Mitchell", handle: "Homeowner, Detroit MI", testimonial: "Fastest quote I've ever gotten. They showed up on time, worked efficiently, and left zero damage.", rating: 5, name: "James Mitchell", handle: "Homeowner, Detroit MI", testimonial: "Fastest quote I've ever gotten. They showed up on time, worked efficiently, and left zero damage.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/closeup-handsome-young-office-worker-glasses-suit-smiling-camera-looking-happy-white_1258-173667.jpg"}, imageSrc: "http://img.b2bpic.net/free-photo/closeup-handsome-young-office-worker-glasses-suit-smiling-camera-looking-happy-white_1258-173667.jpg"
},
{ {
name: "Sarah Chen", handle: "Property Manager, Chicago IL", testimonial: "Professional team. Bilingual support. Firm pricing. Exactly what we needed for our commercial properties.", rating: 5, name: "Sarah Chen", handle: "Property Manager, Chicago IL", testimonial: "Professional team. Bilingual support. Firm pricing. Exactly what we needed for our commercial properties.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-attractive-businesswoman_93675-133773.jpg"}, imageSrc: "http://img.b2bpic.net/free-photo/young-attractive-businesswoman_93675-133773.jpg"
},
{ {
name: "Marcus Johnson", handle: "Contractor, Atlanta GA", testimonial: "Same-day availability for construction debris. Reliable, fast, and reasonably priced.", rating: 5, name: "Marcus Johnson", handle: "Contractor, Atlanta GA", testimonial: "Same-day availability for construction debris. Reliable, fast, and reasonably priced.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/solar-panels-industry-technician-high-tech-factory-inspection-quality-control-production_482257-132256.jpg"}, imageSrc: "http://img.b2bpic.net/free-photo/solar-panels-industry-technician-high-tech-factory-inspection-quality-control-production_482257-132256.jpg"
},
]} ]}
testimonialRotationInterval={5000} testimonialRotationInterval={5000}
/> />
@@ -126,11 +82,14 @@ export default function LandingPage() {
tagAnimation="slide-up" tagAnimation="slide-up"
features={[ features={[
{ {
id: "01", title: "Schedule", description: "Book online or call. Same-day or next-day availability. No long wait times.", imageSrc: "http://img.b2bpic.net/free-vector/medical-booking-application_23-2148558680.jpg", imageAlt: "Easy scheduling interface"}, id: "01", title: "Schedule", description: "Book online or call. Same-day or next-day availability. No long wait times.", imageSrc: "http://img.b2bpic.net/free-vector/medical-booking-application_23-2148558680.jpg", imageAlt: "Easy scheduling interface"
},
{ {
id: "02", title: "Upfront Quote", description: "15-minute phone assessment. Firm pricing. No hidden fees or surprises.", imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-bankruptcy-concept_23-2148493435.jpg", imageAlt: "Transparent pricing consultation"}, id: "02", title: "Upfront Quote", description: "15-minute phone assessment. Firm pricing. No hidden fees or surprises.", imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-bankruptcy-concept_23-2148493435.jpg", imageAlt: "Transparent pricing consultation"
},
{ {
id: "03", title: "Professional Haul", description: "Expert crew. Careful loading. Full cleanup. Damage-free guarantee.", imageSrc: "http://img.b2bpic.net/free-photo/african-american-activist-volunteering-tidy-forest-ecosystem_482257-93953.jpg", imageAlt: "Professional junk removal team at work"}, id: "03", title: "Professional Haul", description: "Expert crew. Careful loading. Full cleanup. Damage-free guarantee.", imageSrc: "http://img.b2bpic.net/free-photo/african-american-activist-volunteering-tidy-forest-ecosystem_482257-93953.jpg", imageAlt: "Professional junk removal team at work"
},
]} ]}
gridVariant="three-columns-all-equal-width" gridVariant="three-columns-all-equal-width"
animationType="slide-up" animationType="slide-up"
@@ -190,17 +149,23 @@ export default function LandingPage() {
author="Robert Williams, Homeowner" author="Robert Williams, Homeowner"
avatars={[ avatars={[
{ {
src: "http://img.b2bpic.net/free-photo/handsome-business-man-wearing-suit-looking-camera-smiling-broadly-with-happy-face-standing-white-background_141793-54115.jpg", alt: "Customer testimonial avatar 1"}, src: "http://img.b2bpic.net/free-photo/handsome-business-man-wearing-suit-looking-camera-smiling-broadly-with-happy-face-standing-white-background_141793-54115.jpg", alt: "Customer testimonial avatar 1"
},
{ {
src: "http://img.b2bpic.net/free-photo/portrait-young-attractive-woman-elegant-hotel-cafeteria_657883-403.jpg", alt: "Customer testimonial avatar 2"}, src: "http://img.b2bpic.net/free-photo/portrait-young-attractive-woman-elegant-hotel-cafeteria_657883-403.jpg", alt: "Customer testimonial avatar 2"
},
{ {
src: "http://img.b2bpic.net/free-photo/close-up-portrait-young-bearded-man-white-shirt-jacket-posing-camera-with-broad-smile-isolated-gray_171337-629.jpg", alt: "Customer testimonial avatar 3"}, src: "http://img.b2bpic.net/free-photo/close-up-portrait-young-bearded-man-white-shirt-jacket-posing-camera-with-broad-smile-isolated-gray_171337-629.jpg", alt: "Customer testimonial avatar 3"
},
{ {
src: "http://img.b2bpic.net/free-vector/man-avatar-collection_24908-60247.jpg", alt: "Customer testimonial avatar 4"}, src: "http://img.b2bpic.net/free-vector/man-avatar-collection_24908-60247.jpg", alt: "Customer testimonial avatar 4"
},
{ {
src: "http://img.b2bpic.net/free-photo/young-beautiful-stylish-woman-with-natural-curly-hairstyle-smiling-positive-emotion-happy-isolated-white-background-summer-fashion-trend-hipster-style-looking-camera-green-vest_285396-2925.jpg", alt: "Customer testimonial avatar 5"}, src: "http://img.b2bpic.net/free-photo/young-beautiful-stylish-woman-with-natural-curly-hairstyle-smiling-positive-emotion-happy-isolated-white-background-summer-fashion-trend-hipster-style-looking-camera-green-vest_285396-2925.jpg", alt: "Customer testimonial avatar 5"
},
{ {
src: "http://img.b2bpic.net/free-photo/smart-looking-teacher_53876-23045.jpg", alt: "Customer testimonial avatar 6"}, src: "http://img.b2bpic.net/free-photo/smart-looking-teacher_53876-23045.jpg", alt: "Customer testimonial avatar 6"
},
]} ]}
ratingAnimation="slide-up" ratingAnimation="slide-up"
avatarsAnimation="slide-up" avatarsAnimation="slide-up"
@@ -211,8 +176,8 @@ export default function LandingPage() {
<div id="contact" data-section="contact"> <div id="contact" data-section="contact">
<ContactSplit <ContactSplit
tag="Get Started" tag="Get Started"
title={confirmationCode ? `Welcome! Your Code: ${confirmationCode}` : "Your Quote Awaits"} title="Your Quote Awaits"
description={confirmationCode ? `Thanks for reaching out! We've sent a confirmation email to ${formData.email}. Our team will contact you within 15 minutes.` : "Fill out our quick assessment form or call us directly. Response guaranteed within 15 minutes during business hours."} description="Fill out our quick assessment form or call us directly. Response guaranteed within 15 minutes during business hours."
tagIcon={Phone} tagIcon={Phone}
tagAnimation="slide-up" tagAnimation="slide-up"
background={{ variant: "sparkles-gradient" }} background={{ variant: "sparkles-gradient" }}
@@ -221,10 +186,9 @@ export default function LandingPage() {
imageAlt="MG Junk Removal team ready to help" imageAlt="MG Junk Removal team ready to help"
mediaAnimation="opacity" mediaAnimation="opacity"
mediaPosition="right" mediaPosition="right"
inputPlaceholder={submissionStatus === "success" ? "Quote request submitted!" : "your@email.com"} inputPlaceholder="Enter your email for quote"
buttonText={submissionStatus === "loading" ? "Sending..." : "Get Quote"} buttonText="Get Quote"
termsText="We respect your privacy. Unsubscribe at any time. By submitting, you agree to our Terms and Conditions." termsText="We respect your privacy. Unsubscribe at any time. By submitting, you agree to our Terms and Conditions."
onSubmit={handleQuoteSubmit}
/> />
</div> </div>

16
src/app/styles/variables.css
View File

@@ -10,15 +10,15 @@
--accent: #ffffff; --accent: #ffffff;
--background-accent: #ffffff; */ --background-accent: #ffffff; */
--background: #f5f4f0; --background: #e3deea;
--card: #ffffff; --card: #ffffff;
--foreground: #1a1a1a; --foreground: #27231f;
--primary-cta: #2c2c2c; --primary-cta: #27231f;
--primary-cta-text: #f5f4f0; --primary-cta-text: #e3deea;
--secondary-cta: #f5f4f0; --secondary-cta: #ffffff;
--secondary-cta-text: #1a1a1a; --secondary-cta-text: #27231f;
--accent: #8a8a8a; --accent: #c68a62;
--background-accent: #e8e6e1; --background-accent: #c68a62;
/* text sizing - set by ThemeProvider */ /* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem); /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);