Merge version_43 into main #65

Merged
bender merged 2 commits from version_43 into main 2026-04-27 01:12:48 +00:00
2 changed files with 16 additions and 52 deletions

View File

@@ -9,8 +9,8 @@ import { Lato } from "next/font/google";
export const metadata: Metadata = {
title: 'Irentall Bridal Boutique | Wedding Dresses Los Angeles',
description: 'Find your perfect wedding dress at Irentall, a luxury bridal boutique in Los Feliz, Los Angeles. Personalized styling, curated gowns, and 5-star service.',
title: 'Irentall - Bridal Styling Los Angeles',
description: 'Find your perfect wedding dress in Los Angeles with our personalized bridal styling services.',
};
const lato = Lato({

View File

@@ -3,58 +3,23 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import HeroSplitDoubleCarousel from "@/components/sections/hero/HeroSplitDoubleCarousel";
import FeatureCardSixteen from "@/components/sections/feature/FeatureCardSixteen";
import TestimonialCardSixteen from "@/components/sections/testimonial/TestimonialCardSixteen";
import ProductCardFour from "@/components/sections/product/ProductCardFour";
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, Instagram, MapPin } from "lucide-react";
import InlineImageSplitTextAbout from "@/components/sections/about/InlineImageSplitTextAbout";
import { Heart, Instagram, Phone, MapPin } from "lucide-react";
import { useState, useEffect, useRef } from "react";
export default function LandingPage() {
const [showModal, setShowModal] = useState(false);
const [showGalleryViewMore, setShowGalleryViewMore] = useState(false);
const [showShoesViewMore, setShowShoesViewMore] = useState(false);
const [showVeilsViewMore, setShowVeilsViewMore] = useState(false);
const [modalType, setModalType] = useState<'gallery' | 'shoes' | 'veils' | null>(null);
const galleryContainerRef = useRef<HTMLDivElement>(null);
const shoesContainerRef = useRef<HTMLDivElement>(null);
const veilsContainerRef = useRef<HTMLDivElement>(null);
const galleryButtonContainerRef = useRef<HTMLDivElement>(null);
const shoesButtonContainerRef = useRef<HTMLDivElement>(null);
const veilsButtonContainerRef = useRef<HTMLDivElement>(null);
useEffect(() => {
const handleScroll = () => {
if (!showModal) {
const checkVisibility = (ref: any, btnRef: any, setter: (v: boolean) => void) => {
if (btnRef.current) {
const rect = btnRef.current.getBoundingClientRect();
setter(rect.top < window.innerHeight && rect.bottom > 0);
}
};
checkVisibility(galleryContainerRef, galleryButtonContainerRef, setShowGalleryViewMore);
checkVisibility(shoesContainerRef, shoesButtonContainerRef, setShowShoesViewMore);
checkVisibility(veilsContainerRef, veilsButtonContainerRef, setShowVeilsViewMore);
}
};
window.addEventListener('scroll', handleScroll);
return () => window.removeEventListener('scroll', handleScroll);
}, [showModal]);
const scrollToGallery = () => document.getElementById('gallery')?.scrollIntoView({ behavior: 'smooth' });
const scrollToShoes = () => document.getElementById('shoes')?.scrollIntoView({ behavior: 'smooth' });
const scrollToVeils = () => document.getElementById('veils')?.scrollIntoView({ behavior: 'smooth' });
const allDresses = Array.from({ length: 25 }, (_, i) => ({ id: `dress-${i + 1}`, name: "Wedding Dress", price: "$1,200+", variant: "White", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773897612811-03t85tl3.jpg", imageAlt: "Wedding gown" }));
const allShoes = Array.from({ length: 12 }, (_, i) => ({ id: `shoe-${i + 1}`, name: "Bridal Shoes", price: "$250+", variant: "White", imageSrc: "http://img.b2bpic.net/free-photo/elegant-beautiful-fashionable-woman-blonde-long-white-dre_7502-4897.jpg", imageAlt: "Bridal shoes" }));
const allVeils = Array.from({ length: 12 }, (_, i) => ({ id: `veil-${i + 1}`, name: "Bridal Veil", price: "$150+", variant: "White", imageSrc: "http://img.b2bpic.net/free-photo/woman-looking-herself_1157-187.jpg", imageAlt: "Bridal veil" }));
const allDresses = Array.from({ length: 6 }, (_, i) => ({ id: `dress-${i + 1}`, name: "Wedding Dress", price: "$1,200+", variant: "White", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773897612811-03t85tl3.jpg", imageAlt: "Wedding gown" }));
return (
<ThemeProvider defaultButtonVariant="shift-hover" defaultTextAnimation="background-highlight" borderRadius="rounded" contentWidth="small" sizing="medium" background="grid" cardStyle="inset" primaryButtonStyle="radial-glow" secondaryButtonStyle="glass" headingFontWeight="light">
<div className="fixed top-0 left-0 w-full z-50 bg-[var(--background)]/90 backdrop-blur-md flex flex-col items-center py-2 gap-2 border-b border-[var(--accent)]/20">
<div id="nav" data-section="nav" className="fixed top-0 left-0 w-full z-50 bg-[var(--background)]/90 backdrop-blur-md flex flex-col items-center py-2 gap-2 border-b border-[var(--accent)]/20">
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1777252323498-sec9a8v5.png" alt="Logo" className="h-12 w-auto object-contain" />
<div className="flex items-center gap-6">
<a href="https://instagram.com/irentall.usa" target="_blank" rel="noopener noreferrer" className="text-[var(--foreground)] hover:text-[var(--primary-cta)]"><Instagram className="w-5 h-5" /></a>
@@ -63,29 +28,28 @@ export default function LandingPage() {
</div>
</div>
<div id="hero" className="pt-32">
<div id="hero" data-section="hero" className="pt-32">
<HeroSplitDoubleCarousel title="Find Your Perfect Wedding Dress in Los Angeles" description="Personalized bridal styling with a curated collection of stunning gowns." background={{ variant: "plain" }} leftCarouselItems={[{ imageSrc: "http://img.b2bpic.net/free-photo/woman-looking-herself_1157-187.jpg" }]} rightCarouselItems={[{ imageSrc: "http://img.b2bpic.net/free-photo/elegant-beautiful-fashionable-woman-blonde-long-white-dre_7502-4897.jpg" }]} />
</div>
<div id="features">
<div id="features" data-section="features">
<FeatureCardSixteen title="What Makes Us Different" description="Personalized service for your big day." negativeCard={{ items: ["Impersonal shopping"] }} positiveCard={{ items: ["One-on-one attention"] }} animationType="slide-up" textboxLayout="default" useInvertedBackground={false} />
</div>
<div id="about">
<TestimonialAboutCard tag="About" title="Iren Ulikhanova" description="Founder and bridal expert." imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg" icon={Heart} />
<div id="about" data-section="about">
<InlineImageSplitTextAbout heading={[{ type: 'text', content: "Iren Ulikhanova" }]} useInvertedBackground={false} />
</div>
<div id="gallery" ref={galleryContainerRef}>
<ProductCardFour title="Our Collection" textboxLayout="default" useInvertedBackground={false} gridVariant="bento-grid" animationType="slide-up" products={allDresses.slice(0, 6)} />
<div ref={galleryButtonContainerRef} className="flex justify-center py-8"><button onClick={() => { setModalType('gallery'); setShowModal(true); }} className="bg-[var(--primary-cta)] text-white px-6 py-2 rounded-lg">View All</button></div>
<div id="gallery" data-section="gallery" ref={galleryContainerRef}>
<ProductCardFour title="Our Collection" description="Explore our latest gowns." textboxLayout="default" useInvertedBackground={false} gridVariant="bento-grid" animationType="slide-up" products={allDresses} />
</div>
<div id="contact">
<ContactCTA tag="Contact" title="Book Your Appointment" description="Call 747-800-7770 to get started." buttons={[{ text: "Call Now", href: "tel:747-800-7770" }]} />
<div id="contact" data-section="contact">
<ContactCTA background="plain" useInvertedBackground={false} tag="Contact" title="Book Your Appointment" description="Call 747-800-7770 to get started." buttons={[{ text: "Call Now", href: "tel:747-800-7770" }]} />
</div>
<div id="footer">
<FooterSimple columns={[{ title: "Links", items: [{ label: "Home", href: "#" }] }]} bottomLeftText="© 2024 Irentall." bottomRightText="Los Angeles, CA" />
<div id="footer" data-section="footer">
<FooterSimple logoText="Irentall" columns={[{ title: "Links", items: [{ label: "Home", href: "/" }] }]} copyrightText="© 2024 Irentall." />
</div>
</ThemeProvider>
);