Merge version_2_1781365591354 into main #4
@@ -1,202 +1,33 @@
|
||||
import AboutTestimonial from '@/components/sections/about/AboutTestimonial';
|
||||
import ContactCta from '@/components/sections/contact/ContactCta';
|
||||
import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
|
||||
import FeaturesMediaCards from '@/components/sections/features/FeaturesMediaCards';
|
||||
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
|
||||
import SocialProofMarquee from '@/components/sections/social-proof/SocialProofMarquee';
|
||||
import TestimonialMarqueeOverlayCards from '@/components/sections/testimonial/TestimonialMarqueeOverlayCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
// AUTO-GENERATED shell by per-section-migrate.
|
||||
// Section bodies live in ./<PageBase>/sections/<X>.tsx. Edit the section
|
||||
// files directly. Non-block content (wrappers, non-inlinable sections) is
|
||||
// preserved inline; extracted section blocks become <XSection/> refs.
|
||||
|
||||
export default function HomePage() {
|
||||
import React from 'react';
|
||||
import HeroSection from './HomePage/sections/Hero';
|
||||
import AboutSection from './HomePage/sections/About';
|
||||
import ProductsSection from './HomePage/sections/Products';
|
||||
import FeaturesSection from './HomePage/sections/Features';
|
||||
import SocialProofSection from './HomePage/sections/SocialProof';
|
||||
import TestimonialSection from './HomePage/sections/Testimonial';
|
||||
import ContactSection from './HomePage/sections/Contact';
|
||||
|
||||
export default function HomePage(): React.JSX.Element {
|
||||
return (
|
||||
<>
|
||||
<div id="hero" data-section="hero">
|
||||
<SectionErrorBoundary name="hero">
|
||||
<HeroOverlay
|
||||
tag="Cinematic Editorial"
|
||||
title="Where Fashion Meets the Lens"
|
||||
description="Redefining the aesthetic of modern style through cinematic storytelling. Experience the intersection of haute couture and motion."
|
||||
primaryButton={{
|
||||
text: "View Collection",
|
||||
href: "#products",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Our Vision",
|
||||
href: "#about",
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/pisces-portrait-beautiful-woman_23-2149275085.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<>
|
||||
<HeroSection />
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SectionErrorBoundary name="about">
|
||||
<AboutTestimonial
|
||||
tag="Our Essence"
|
||||
quote="In every frame, there is a story to be told—where the texture of silk meets the grain of film."
|
||||
author="Elena V."
|
||||
role="Creative Director"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-young-man-posing-spotlight_23-2151916009.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<AboutSection />
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<SectionErrorBoundary name="products">
|
||||
<FeaturesImageBento
|
||||
tag="Curated Collections"
|
||||
title="Cinematic Apparel"
|
||||
description="Explore our seasonal pieces, crafted with the same precision as a director's final cut."
|
||||
items={[
|
||||
{
|
||||
title: "Velvet Noir",
|
||||
description: "The deep winter collection.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021796.jpg",
|
||||
},
|
||||
{
|
||||
title: "Crimson Edge",
|
||||
description: "Bold, dramatic silhouettes.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/bride-sitting-windowsill-holds-wedding-dress_1153-5941.jpg",
|
||||
},
|
||||
{
|
||||
title: "Film Grain Knit",
|
||||
description: "Textured comfort, classic look.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-sexy-model-woman-shiny-lace-evening-dress-posing-sitting-chair-beige-color_285396-7779.jpg",
|
||||
},
|
||||
{
|
||||
title: "Director Series",
|
||||
description: "Signature pieces.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-portrait-teenager-woman_23-2149453350.jpg",
|
||||
},
|
||||
{
|
||||
title: "Night Shoot",
|
||||
description: "Elegant evening wear.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-fashion-stylish-brunette-woman-model-with-evening-makeup-red-lips-white-jacket_158538-11532.jpg",
|
||||
},
|
||||
{
|
||||
title: "Couture Cuts",
|
||||
description: "Sharper than a lens.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-outdoors_23-2148323531.jpg",
|
||||
},
|
||||
{
|
||||
title: "The Main Lead",
|
||||
description: "Your statement garment.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/charming-curly-blonde-woman-pearl-jewelry-white-blouse-brown-velvet-pants-sits-near-wooden-old-door-poses-with-closed-eyes_197531-23206.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<ProductsSection />
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<SectionErrorBoundary name="features">
|
||||
<FeaturesMediaCards
|
||||
tag="Cinematic Factor"
|
||||
title="Why Cinematic Fashion?"
|
||||
description="We bridge the gap between traditional fashion and high-end visual production."
|
||||
items={[
|
||||
{
|
||||
title: "Motion-First Design",
|
||||
description: "Pieces that flow beautifully on camera.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fashion-photo-young-magnificent-woman-white-shirt_158595-1012.jpg",
|
||||
},
|
||||
{
|
||||
title: "Narrative Textures",
|
||||
description: "Fabrics curated for film grain and high-res capture.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fashion-photo-young-magnificent-woman-white-shirt_158595-1014.jpg",
|
||||
},
|
||||
{
|
||||
title: "Visual Storytelling",
|
||||
description: "Style that makes an instant impact in any visual media.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fashion-photo-young-magnificent-woman-white-shirt_158595-1017.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<FeaturesSection />
|
||||
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SectionErrorBoundary name="social-proof">
|
||||
<SocialProofMarquee
|
||||
tag="Featured In"
|
||||
title="Global Editorial Features"
|
||||
description="Our work has been featured in top cinematic and fashion publications."
|
||||
names={[
|
||||
"Vogue Cinematic",
|
||||
"Lens Magazine",
|
||||
"Couture Monthly",
|
||||
"Film & Style",
|
||||
"Noir Daily",
|
||||
"The Edit",
|
||||
"Fashion Narrative",
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<SocialProofSection />
|
||||
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<SectionErrorBoundary name="testimonial">
|
||||
<TestimonialMarqueeOverlayCards
|
||||
tag="From The Set"
|
||||
title="Editorial Perspectives"
|
||||
description="Hear what our collaborators and clients have to say about the CineFashion experience."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Marcus R.",
|
||||
role: "Photographer",
|
||||
company: "Urban Visions",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pisces-portrait-beautiful-woman_23-2149275132.jpg",
|
||||
},
|
||||
{
|
||||
name: "Sophia L.",
|
||||
role: "Stylist",
|
||||
company: "Vogue Trends",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-young-woman-shooting-with-projector_23-2149424927.jpg",
|
||||
},
|
||||
{
|
||||
name: "Julian B.",
|
||||
role: "Creative Lead",
|
||||
company: "Studio 5",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-working-her-worshop_23-2149536263.jpg",
|
||||
},
|
||||
{
|
||||
name: "Amelia D.",
|
||||
role: "Art Director",
|
||||
company: "Cinematic Arts",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-young-woman-posing-with-plants_23-2149651992.jpg",
|
||||
},
|
||||
{
|
||||
name: "Liam K.",
|
||||
role: "Cinematographer",
|
||||
company: "Lens Collective",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021812.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<TestimonialSection />
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<ContactCta
|
||||
tag="Let's Collaborate"
|
||||
text="Ready to bring your cinematic fashion vision to life? Let's discuss your next project."
|
||||
primaryButton={{
|
||||
text: "Contact Inquiries",
|
||||
href: "mailto:hello@cinefashion.com",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Book Session",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<ContactSection />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
22
src/pages/HomePage/sections/About.tsx
Normal file
22
src/pages/HomePage/sections/About.tsx
Normal file
@@ -0,0 +1,22 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "about" section.
|
||||
|
||||
import React from 'react';
|
||||
import AboutTestimonial from '@/components/sections/about/AboutTestimonial';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function AboutSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="about" data-section="about">
|
||||
<SectionErrorBoundary name="about">
|
||||
<AboutTestimonial
|
||||
tag="Our Approach"
|
||||
quote="We don't just make clothes; we create the wardrobe for the moments that matter. Every piece is designed to feel like it belongs in a film."
|
||||
author="Elena V."
|
||||
role="Creative Director"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-young-man-posing-spotlight_23-2151916009.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
27
src/pages/HomePage/sections/Contact.tsx
Normal file
27
src/pages/HomePage/sections/Contact.tsx
Normal file
@@ -0,0 +1,27 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "contact" section.
|
||||
|
||||
import React from 'react';
|
||||
import ContactCta from '@/components/sections/contact/ContactCta';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function ContactSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<ContactCta
|
||||
tag="Get in Touch"
|
||||
text="Have a project in mind or just want to say hello? We'd love to hear from you."
|
||||
primaryButton={{
|
||||
text: "Contact Inquiries",
|
||||
href: "mailto:hello@cinefashion.com",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Book Session",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
37
src/pages/HomePage/sections/Features.tsx
Normal file
37
src/pages/HomePage/sections/Features.tsx
Normal file
@@ -0,0 +1,37 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "features" section.
|
||||
|
||||
import React from 'react';
|
||||
import FeaturesMediaCards from '@/components/sections/features/FeaturesMediaCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function FeaturesSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="features" data-section="features">
|
||||
<SectionErrorBoundary name="features">
|
||||
<FeaturesMediaCards
|
||||
tag="The Details"
|
||||
title="Why We Do It"
|
||||
description="We think about fashion a little differently. It's not just about trends; it's about how you feel when you wear it."
|
||||
items={[
|
||||
{
|
||||
title: "Motion-First Design",
|
||||
description: "Pieces that flow beautifully on camera.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fashion-photo-young-magnificent-woman-white-shirt_158595-1012.jpg",
|
||||
},
|
||||
{
|
||||
title: "Narrative Textures",
|
||||
description: "Fabrics curated for film grain and high-res capture.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fashion-photo-young-magnificent-woman-white-shirt_158595-1014.jpg",
|
||||
},
|
||||
{
|
||||
title: "Visual Storytelling",
|
||||
description: "Style that makes an instant impact in any visual media.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fashion-photo-young-magnificent-woman-white-shirt_158595-1017.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
29
src/pages/HomePage/sections/Hero.tsx
Normal file
29
src/pages/HomePage/sections/Hero.tsx
Normal file
@@ -0,0 +1,29 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "hero" section.
|
||||
|
||||
import React from 'react';
|
||||
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function HeroSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="hero" data-section="hero">
|
||||
<SectionErrorBoundary name="hero">
|
||||
<HeroOverlay
|
||||
tag="The Vision"
|
||||
title="Style in Motion"
|
||||
description="We design clothes that look as good in motion as they do standing still. It's about capturing the feeling of a scene, not just the look."
|
||||
primaryButton={{
|
||||
text: "View Collection",
|
||||
href: "#products",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Our Vision",
|
||||
href: "#about",
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/pisces-portrait-beautiful-woman_23-2149275085.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
57
src/pages/HomePage/sections/Products.tsx
Normal file
57
src/pages/HomePage/sections/Products.tsx
Normal file
@@ -0,0 +1,57 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "products" section.
|
||||
|
||||
import React from 'react';
|
||||
import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function ProductsSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="products" data-section="products">
|
||||
<SectionErrorBoundary name="products">
|
||||
<FeaturesImageBento
|
||||
tag="The Collection"
|
||||
title="Current Season"
|
||||
description="Take a look at our latest pieces. We focus on texture, movement, and how the light hits the fabric."
|
||||
items={[
|
||||
{
|
||||
title: "Velvet Noir",
|
||||
description: "The deep winter collection.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021796.jpg",
|
||||
},
|
||||
{
|
||||
title: "Crimson Edge",
|
||||
description: "Bold, dramatic silhouettes.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/bride-sitting-windowsill-holds-wedding-dress_1153-5941.jpg",
|
||||
},
|
||||
{
|
||||
title: "Film Grain Knit",
|
||||
description: "Textured comfort, classic look.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-sexy-model-woman-shiny-lace-evening-dress-posing-sitting-chair-beige-color_285396-7779.jpg",
|
||||
},
|
||||
{
|
||||
title: "Director Series",
|
||||
description: "Signature pieces.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-portrait-teenager-woman_23-2149453350.jpg",
|
||||
},
|
||||
{
|
||||
title: "Night Shoot",
|
||||
description: "Elegant evening wear.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-fashion-stylish-brunette-woman-model-with-evening-makeup-red-lips-white-jacket_158538-11532.jpg",
|
||||
},
|
||||
{
|
||||
title: "Couture Cuts",
|
||||
description: "Sharper than a lens.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-outdoors_23-2148323531.jpg",
|
||||
},
|
||||
{
|
||||
title: "The Main Lead",
|
||||
description: "Your statement garment.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/charming-curly-blonde-woman-pearl-jewelry-white-blouse-brown-velvet-pants-sits-near-wooden-old-door-poses-with-closed-eyes_197531-23206.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
29
src/pages/HomePage/sections/SocialProof.tsx
Normal file
29
src/pages/HomePage/sections/SocialProof.tsx
Normal file
@@ -0,0 +1,29 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "social-proof" section.
|
||||
|
||||
import React from 'react';
|
||||
import SocialProofMarquee from '@/components/sections/social-proof/SocialProofMarquee';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function SocialProofSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SectionErrorBoundary name="social-proof">
|
||||
<SocialProofMarquee
|
||||
tag="Press"
|
||||
title="Where We've Been Seen"
|
||||
description="We're grateful to have our work recognized by some of the voices we respect most in the industry."
|
||||
names={[
|
||||
"Vogue Cinematic",
|
||||
"Lens Magazine",
|
||||
"Couture Monthly",
|
||||
"Film & Style",
|
||||
"Noir Daily",
|
||||
"The Edit",
|
||||
"Fashion Narrative",
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
57
src/pages/HomePage/sections/Testimonial.tsx
Normal file
57
src/pages/HomePage/sections/Testimonial.tsx
Normal file
@@ -0,0 +1,57 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "testimonial" section.
|
||||
|
||||
import React from 'react';
|
||||
import TestimonialMarqueeOverlayCards from '@/components/sections/testimonial/TestimonialMarqueeOverlayCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function TestimonialSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<SectionErrorBoundary name="testimonial">
|
||||
<TestimonialMarqueeOverlayCards
|
||||
tag="Community"
|
||||
title="What They're Saying"
|
||||
description="Don't just take our word for it. Here's what the people we work with have to say."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Marcus R.",
|
||||
role: "Photographer",
|
||||
company: "Urban Visions",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pisces-portrait-beautiful-woman_23-2149275132.jpg",
|
||||
},
|
||||
{
|
||||
name: "Sophia L.",
|
||||
role: "Stylist",
|
||||
company: "Vogue Trends",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-young-woman-shooting-with-projector_23-2149424927.jpg",
|
||||
},
|
||||
{
|
||||
name: "Julian B.",
|
||||
role: "Creative Lead",
|
||||
company: "Studio 5",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-working-her-worshop_23-2149536263.jpg",
|
||||
},
|
||||
{
|
||||
name: "Amelia D.",
|
||||
role: "Art Director",
|
||||
company: "Cinematic Arts",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-young-woman-posing-with-plants_23-2149651992.jpg",
|
||||
},
|
||||
{
|
||||
name: "Liam K.",
|
||||
role: "Cinematographer",
|
||||
company: "Lens Collective",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021812.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user