Compare commits
33 Commits
version_16
...
version_27
| Author | SHA1 | Date | |
|---|---|---|---|
| b0360b5784 | |||
| b6a8015b5a | |||
| c74227ca00 | |||
| 34667b3e39 | |||
| 3f4359dd46 | |||
| 30c0b01057 | |||
| 0b84fe33a3 | |||
| 970fa3fbea | |||
| 9807ee790c | |||
| b5994e8235 | |||
| e3f129208b | |||
| 1560f38543 | |||
| b835383e2a | |||
| c6ecfb010e | |||
| 64f3c3869b | |||
| 846aa84155 | |||
| 81a68f5e71 | |||
| ef67dd7d0c | |||
| 0de13d4ccc | |||
| fcc0441f5a | |||
| 452b4d00c9 | |||
| 53b6683972 | |||
| e94914d0ba | |||
| 5796afa7d7 | |||
| c91a752f88 | |||
| c295bceaa4 | |||
| e56e865f1a | |||
| a16cb96315 | |||
| 08852338d6 | |||
| e396880075 | |||
| 7a662c5872 | |||
| dd69bdcbb8 | |||
| 35c9cd39b9 |
195
src/app/page.tsx
195
src/app/page.tsx
@@ -1,7 +1,6 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
|
||||
import HeroSplitDoubleCarousel from "@/components/sections/hero/HeroSplitDoubleCarousel";
|
||||
import FeatureCardSixteen from "@/components/sections/feature/FeatureCardSixteen";
|
||||
import TestimonialCardSixteen from "@/components/sections/testimonial/TestimonialCardSixteen";
|
||||
@@ -10,7 +9,7 @@ import ContactCTA from "@/components/sections/contact/ContactCTA";
|
||||
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||
import TestimonialAboutCard from "@/components/sections/about/TestimonialAboutCard";
|
||||
import BlogCardThree from "@/components/sections/blog/BlogCardThree";
|
||||
import { Star, Heart, Users, Camera, Sparkles, Crown, Phone, MessageCircle, User, Play, ChevronRight, X, ArrowDown, ArrowUp } from "lucide-react";
|
||||
import { Star, Heart, Users, Camera, Sparkles, Crown, Phone, MessageCircle, User, Play, ChevronRight, X, ArrowDown, ArrowUp, Instagram, MapPin } from "lucide-react";
|
||||
import { useState, useEffect } from "react";
|
||||
|
||||
export default function LandingPage() {
|
||||
@@ -139,64 +138,123 @@ export default function LandingPage() {
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="light"
|
||||
>
|
||||
{/* Decorative Vertical Border/Divider with Gold Accents */}
|
||||
<div className="fixed left-1/2 transform -translate-x-1/2 top-0 w-px h-screen pointer-events-none z-0">
|
||||
{/* Main vertical line with gradient */}
|
||||
<div className="absolute left-0 top-0 w-full h-full bg-gradient-to-b from-transparent via-[#D4AF37] to-transparent opacity-40" />
|
||||
{/* Decorative Squiggly Curved Lines with Gold Accents */}
|
||||
<svg
|
||||
className="fixed inset-0 pointer-events-none z-0 w-full h-full"
|
||||
viewBox="0 0 1920 1080"
|
||||
preserveAspectRatio="none"
|
||||
style={{
|
||||
opacity: 0.6,
|
||||
}}
|
||||
>
|
||||
{/* Multiple squiggly curved lines flowing diagonally from top-left to bottom-right */}
|
||||
|
||||
{/* Gold accent dots distributed throughout */}
|
||||
<div className="absolute left-1/2 transform -translate-x-1/2 top-[10%] w-1.5 h-1.5 rounded-full bg-[#D4AF37] opacity-60" />
|
||||
<div className="absolute left-1/2 transform -translate-x-1/2 top-[20%] w-1 h-1 rounded-full bg-[#D4AF37] opacity-50" />
|
||||
<div className="absolute left-1/2 transform -translate-x-1/2 top-[30%] w-2 h-2 rounded-full bg-[#D4AF37] opacity-45" />
|
||||
<div className="absolute left-1/2 transform -translate-x-1/2 top-[40%] w-1 h-1 rounded-full bg-[#D4AF37] opacity-55" />
|
||||
<div className="absolute left-1/2 transform -translate-x-1/2 top-[50%] w-1.5 h-1.5 rounded-full bg-[#D4AF37] opacity-50" />
|
||||
<div className="absolute left-1/2 transform -translate-x-1/2 top-[60%] w-1 h-1 rounded-full bg-[#D4AF37] opacity-55" />
|
||||
<div className="absolute left-1/2 transform -translate-x-1/2 top-[70%] w-2 h-2 rounded-full bg-[#D4AF37] opacity-45" />
|
||||
<div className="absolute left-1/2 transform -translate-x-1/2 top-[80%] w-1 h-1 rounded-full bg-[#D4AF37] opacity-60" />
|
||||
<div className="absolute left-1/2 transform -translate-x-1/2 top-[90%] w-1.5 h-1.5 rounded-full bg-[#D4AF37] opacity-50" />
|
||||
</div>
|
||||
{/* Line 1 - Main centerline */}
|
||||
<path
|
||||
d="M 0 0 Q 200 150, 300 250 T 600 500 T 900 700 T 1200 850 T 1920 1080"
|
||||
stroke="#D4AF37"
|
||||
strokeWidth="3"
|
||||
fill="none"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
|
||||
{/* Line 2 - Left offset */}
|
||||
<path
|
||||
d="M -150 50 Q 100 180, 200 300 T 500 550 T 800 750 T 1100 900 T 1700 1050"
|
||||
stroke="#D4AF37"
|
||||
strokeWidth="2.5"
|
||||
fill="none"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
opacity="0.7"
|
||||
/>
|
||||
|
||||
{/* Line 3 - Right offset */}
|
||||
<path
|
||||
d="M 150 -20 Q 350 120, 480 220 T 800 480 T 1100 680 T 1350 850 T 1920 1000"
|
||||
stroke="#D4AF37"
|
||||
strokeWidth="2"
|
||||
fill="none"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
opacity="0.65"
|
||||
/>
|
||||
|
||||
{/* Line 4 - Far left */}
|
||||
<path
|
||||
d="M -300 100 Q -50 250, 80 350 T 400 600 T 700 800 T 950 950 T 1450 1080"
|
||||
stroke="#D4AF37"
|
||||
strokeWidth="2"
|
||||
fill="none"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
opacity="0.55"
|
||||
/>
|
||||
|
||||
{/* Line 5 - Far right */}
|
||||
<path
|
||||
d="M 300 20 Q 500 160, 650 280 T 950 520 T 1250 720 T 1550 900 T 1920 1080"
|
||||
stroke="#D4AF37"
|
||||
strokeWidth="1.5"
|
||||
fill="none"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
opacity="0.5"
|
||||
/>
|
||||
</svg>
|
||||
|
||||
{/* Fixed "Go to Dresses" Button */}
|
||||
<button
|
||||
onClick={scrollToGallery}
|
||||
className="fixed right-6 bottom-32 z-40 w-16 h-16 rounded-full bg-gradient-to-r from-[var(--primary-cta)] to-[var(--primary-cta)] text-[var(--primary-cta-text)] shadow-lg hover:shadow-2xl transition-all duration-300 ease-out flex items-center justify-center hover:scale-110 active:scale-95"
|
||||
className="fixed right-6 bottom-32 z-40 w-12 h-12 rounded-full bg-gradient-to-r from-[#D4AF37] to-[#D4AF37] text-black shadow-lg hover:shadow-2xl transition-all duration-300 ease-out flex items-center justify-center hover:scale-110 active:scale-95"
|
||||
aria-label="Go to Dresses"
|
||||
title="Go to Dresses"
|
||||
>
|
||||
<div className="flex flex-col items-center justify-center gap-1">
|
||||
<ArrowDown className="w-5 h-5" />
|
||||
<div className="flex flex-col items-center justify-center gap-0.5">
|
||||
<ArrowDown className="w-4 h-4" />
|
||||
<span className="text-xs font-semibold text-center leading-tight">Dresses</span>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
{/* Fixed Back-to-Top Button */}
|
||||
{showBackToTop && (
|
||||
<button
|
||||
onClick={scrollToTop}
|
||||
className="fixed right-6 bottom-6 z-40 w-16 h-16 rounded-full bg-gradient-to-r from-[var(--secondary-cta)] to-[var(--secondary-cta)] text-[var(--secondary-cta-text)] shadow-lg hover:shadow-2xl transition-all duration-300 ease-out flex items-center justify-center hover:scale-110 active:scale-95 animate-in fade-in-0 duration-300"
|
||||
aria-label="Back to Top"
|
||||
title="Back to Top"
|
||||
{/* Fixed Top Social & Contact Bar */}
|
||||
<div className="fixed top-0 left-0 right-0 z-50 bg-[#D4AF37] text-black py-3 px-4 flex items-center justify-center gap-6">
|
||||
{/* Instagram */}
|
||||
<a
|
||||
href="https://instagram.com/irentall.usa"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="hover:scale-110 transition-transform duration-300 ease-out"
|
||||
aria-label="Follow us on Instagram"
|
||||
title="Follow us on Instagram @irentall.usa"
|
||||
>
|
||||
<ArrowUp className="w-5 h-5" />
|
||||
</button>
|
||||
)}
|
||||
<Instagram className="w-6 h-6" />
|
||||
</a>
|
||||
|
||||
<div id="nav" data-section="nav" className="relative z-20">
|
||||
<NavbarStyleCentered
|
||||
brandName="Irentall"
|
||||
navItems={[
|
||||
{ name: "Home", id: "home" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Gallery", id: "gallery" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
button={{
|
||||
text: "Call Now", href: "tel:747-800-7770"
|
||||
}}
|
||||
/>
|
||||
{/* Phone */}
|
||||
<a
|
||||
href="tel:747-800-7770"
|
||||
className="hover:scale-110 transition-transform duration-300 ease-out"
|
||||
aria-label="Call us"
|
||||
title="Call (747) 800-7770"
|
||||
>
|
||||
<Phone className="w-6 h-6" />
|
||||
</a>
|
||||
|
||||
{/* Google Maps */}
|
||||
<a
|
||||
href="https://www.google.com/maps/search/Irentall"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="hover:scale-110 transition-transform duration-300 ease-out"
|
||||
aria-label="Search Irentall on Google Maps"
|
||||
title="Search Irentall on Google Maps"
|
||||
>
|
||||
<MapPin className="w-6 h-6" />
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero" className="relative z-10">
|
||||
<div id="hero" data-section="hero" className="relative z-10 mt-16">
|
||||
<HeroSplitDoubleCarousel
|
||||
title="Find Your Perfect Wedding Dress in Los Angeles"
|
||||
description="Personalized bridal styling with a curated collection of stunning gowns. Our expert team will guide you through every moment of your journey to find the dress of your dreams."
|
||||
@@ -291,19 +349,11 @@ export default function LandingPage() {
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Marina Farhardyan ", role: "Bride", company: "Irentall Boutique", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-bride-posing-medium-shot_23-2149860841.jpg?_wi=2", imageAlt: "Sarah Johnson - Happy bride"
|
||||
imageSrc: "", imageAlt: "Sarah Johnson - Happy bride"
|
||||
},
|
||||
{
|
||||
id: "2", name: "Jessica Martinez", role: "Bride", company: "Irentall Boutique", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-women-enjoying-bachelorette-party_23-2149278361.jpg?_wi=2", imageAlt: "Jessica Martinez - Bride with friends"
|
||||
},
|
||||
{
|
||||
id: "3", name: "Emily Chen", role: "Bride", company: "Irentall Boutique", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/reflection-senior-mother-mature-daughter-mirror-home_23-2148202921.jpg", imageAlt: "Emily Chen - Bride in mirror"
|
||||
},
|
||||
{
|
||||
id: "4", name: "Michelle Rodriguez", role: "Bride", company: "Irentall Boutique", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/elegant-bride-posing_23-2148105871.jpg?_wi=2", imageAlt: "Michelle Rodriguez - Happy bride moment"
|
||||
imageSrc: "", imageAlt: "Jessica Martinez - Bride with friends"
|
||||
}
|
||||
]}
|
||||
animationType="slide-up"
|
||||
@@ -325,16 +375,18 @@ export default function LandingPage() {
|
||||
products={initialDresses}
|
||||
/>
|
||||
|
||||
{/* View More Button Positioned on Right */}
|
||||
<div className="flex justify-end px-4 md:px-8 lg:px-16 py-6 md:py-10">
|
||||
<button
|
||||
onClick={() => setShowModal(true)}
|
||||
className="group relative inline-flex items-center gap-2 px-6 md:px-8 py-3 md:py-4 bg-gradient-to-r from-[var(--primary-cta)] to-[var(--primary-cta)] text-[var(--primary-cta-text)] rounded-lg font-semibold hover:shadow-lg transition-all duration-300 ease-out"
|
||||
aria-label="View More Dresses"
|
||||
>
|
||||
<span className="text-sm md:text-base">View More Dresses</span>
|
||||
<ChevronRight className="w-5 h-5 md:w-6 md:h-6 group-hover:translate-x-1 transition-transform" />
|
||||
</button>
|
||||
{/* View More Button Positioned After 6th Picture */}
|
||||
<div className="relative mt-0">
|
||||
<div className="absolute -top-[280px] right-8 lg:right-16 z-30 flex justify-end">
|
||||
<button
|
||||
onClick={() => setShowModal(true)}
|
||||
className="group relative inline-flex items-center gap-2 px-4 md:px-6 py-2 md:py-3 bg-gradient-to-r from-[#D4AF37] to-[#D4AF37] text-black rounded-lg font-semibold hover:shadow-lg transition-all duration-300 ease-out shadow-lg"
|
||||
aria-label="View More Dresses"
|
||||
>
|
||||
<span className="text-sm md:text-base">View More Dresses</span>
|
||||
<ChevronRight className="w-4 h-4 md:w-5 md:h-5 group-hover:translate-x-1 transition-transform" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -416,16 +468,16 @@ export default function LandingPage() {
|
||||
animationType="slide-up"
|
||||
blogs={[
|
||||
{
|
||||
id: "reel-1", category: "", title: "", excerpt: "", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-bride-posing-medium-shot_23-2149860841.jpg?_wi=2", imageAlt: "Bride and groom first look moment", authorName: "Irentall Team", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg", date: ""
|
||||
id: "reel-1", category: "", title: "", excerpt: "", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773947446212-9rkbuuli.mp4?_wi=1", imageAlt: "Bride and groom first look moment", authorName: "Irentall Team", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg", date: ""
|
||||
},
|
||||
{
|
||||
id: "reel-2", category: "", title: "", excerpt: "", imageSrc: "http://img.b2bpic.net/free-photo/young-women-enjoying-bachelorette-party_23-2149278361.jpg?_wi=2", imageAlt: "Bride twirling in wedding dress", authorName: "Irentall Team", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg", date: ""
|
||||
id: "reel-2", category: "", title: "", excerpt: "", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773947446212-9rkbuuli.mp4?_wi=2", imageAlt: "Bride twirling in wedding dress", authorName: "Irentall Team", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg", date: ""
|
||||
},
|
||||
{
|
||||
id: "reel-3", category: "", title: "", excerpt: "", imageSrc: "http://img.b2bpic.net/free-photo/elegant-beautiful-fashionable-woman-blonde-long-white-dre_7502-4897.jpg?_wi=2", imageAlt: "Bride with complete bridal accessories", authorName: "Irentall Team", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg", date: ""
|
||||
id: "reel-3", category: "", title: "", excerpt: "", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773947446212-9rkbuuli.mp4?_wi=3", imageAlt: "Bride with complete bridal accessories", authorName: "Irentall Team", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg", date: ""
|
||||
},
|
||||
{
|
||||
id: "reel-4", category: "", title: "", excerpt: "", imageSrc: "http://img.b2bpic.net/free-photo/elegant-bride-posing_23-2148105871.jpg?_wi=2", imageAlt: "Close-up of wedding dress lace details", authorName: "Irentall Team", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg", date: ""
|
||||
id: "reel-4", category: "", title: "", excerpt: "", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773947446212-9rkbuuli.mp4?_wi=4", imageAlt: "Close-up of wedding dress lace details", authorName: "Irentall Team", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg", date: ""
|
||||
}
|
||||
]}
|
||||
uniformGridCustomHeightClasses="min-h-120 2xl:min-h-150"
|
||||
@@ -506,7 +558,7 @@ export default function LandingPage() {
|
||||
tagIcon={Phone}
|
||||
tagAnimation="slide-up"
|
||||
title="Ready to Find Your Dream Dress?"
|
||||
description="Call or text us at 747-800-7770 to schedule your personal styling appointment. Our team is here to make your bridal journey unforgettable."
|
||||
description="Book your free 30-minute styling session with limited availability! Our bridal experts will work with you one-on-one to find the perfect gown. Call or text (747) 800-7770 to secure your appointment today."
|
||||
buttons={[
|
||||
{ text: "Call (747) 800-7770", href: "tel:747-800-7770" },
|
||||
{ text: "Text (747) 800-7770", href: "sms:747-800-7770" }
|
||||
@@ -514,8 +566,7 @@ export default function LandingPage() {
|
||||
buttonAnimation="slide-up"
|
||||
background={{ variant: "plain" }}
|
||||
useInvertedBackground={false}
|
||||
buttonContainerClassName="flex flex-col sm:flex-row gap-3 justify-center"
|
||||
buttonClassName="first:order-first second:order-last"
|
||||
buttonContainerClassName="flex flex-col-reverse sm:flex-row gap-3 justify-center"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -560,4 +611,4 @@ export default function LandingPage() {
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user