From 3f0c4c8e401369549dec0aac410d6969f1e28161 Mon Sep 17 00:00:00 2001
From: kudinDmitriyUp <kudin.dmitriy.up@gmail.com>
Date: Thu, 25 Jun 2026 07:32:27 +0000
Subject: [PATCH 1/2] Bob AI: Add landing page

---
 src/App.tsx               |  2 ++
 src/components/Layout.tsx |  4 +++-
 src/pages/LandingPage.tsx | 46 +++++++++++++++++++++++++++++++++++++++
 src/routes.ts             |  1 +
 4 files changed, 52 insertions(+), 1 deletion(-)
 create mode 100644 src/pages/LandingPage.tsx

diff --git a/src/App.tsx b/src/App.tsx
index 33d15f9..39f19c4 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -2,11 +2,13 @@ import { Routes, Route } from 'react-router-dom';
 import Layout from './components/Layout';
 import HomePage from './pages/HomePage';
 
+import LandingPage from "@/pages/LandingPage";
 export default function App() {
   return (
     <Routes>
       <Route element={<Layout />}>
         <Route path="/" element={<HomePage />} />
+        <Route path="/landing" element={<LandingPage />} />
       </Route>
     </Routes>
   );
diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx
index 72f87eb..18f3fb2 100644
--- a/src/components/Layout.tsx
+++ b/src/components/Layout.tsx
@@ -34,7 +34,9 @@ export default function Layout() {
   {
     "name": "Social",
     "href": "#social"
-  }
+  },
+  { name: "Landing", href: "/landing" },
+
 ];
 
   return (
diff --git a/src/pages/LandingPage.tsx b/src/pages/LandingPage.tsx
new file mode 100644
index 0000000..837c632
--- /dev/null
+++ b/src/pages/LandingPage.tsx
@@ -0,0 +1,46 @@
+import React from 'react';
+import { routes } from "@/routes";
+import NavbarCentered from "@/components/ui/NavbarCentered";
+import FloatingGradientBackground from "@/components/ui/FloatingGradientBackground";
+import HeroBillboard from "@/components/sections/hero/HeroBillboard";
+import AboutText from "@/components/sections/about/AboutText";
+import FooterMinimal from "@/components/sections/footer/FooterMinimal";
+
+export default function LandingPage() {
+  return (
+    <div className="relative min-h-screen bg-background text-foreground overflow-hidden">
+      <FloatingGradientBackground position="fixed" />
+      
+      <div className="relative z-10 flex flex-col min-h-screen">
+        <NavbarCentered
+          logo="The Dollhouse"
+          navItems={routes.map((r) => ({ name: r.label, href: r.path }))}
+          ctaButton={{ text: "Enter Now", href: "/home" }}
+        />
+        
+        <main className="flex-grow">
+          <HeroBillboard
+            tag="Welcome"
+            title="The Dollhouse Collective"
+            description="Step into a curated world of style, beauty, and modern aesthetics. Your journey begins here."
+            primaryButton={{ text: "Enter Website", href: "/home" }}
+            secondaryButton={{ text: "Join the Club", href: "/join" }}
+            imageSrc="https://images.unsplash.com/photo-1490481651871-ab68de25d43d?q=80&w=2070&auto=format&fit=crop"
+          />
+          
+          <div className="py-24 bg-card text-card-foreground">
+            <AboutText
+              title="More than just a brand, it is a lifestyle. Discover our carefully curated selections designed to elevate your everyday aesthetic."
+              primaryButton={{ text: "Read Our Story", href: "/about" }}
+            />
+          </div>
+        </main>
+
+        <FooterMinimal
+          brand="The Dollhouse Collective"
+          copyright="© 2024 The Dollhouse Collective. All rights reserved."
+        />
+      </div>
+    </div>
+  );
+}
\ No newline at end of file
diff --git a/src/routes.ts b/src/routes.ts
index 362ecb5..50e7753 100644
--- a/src/routes.ts
+++ b/src/routes.ts
@@ -6,4 +6,5 @@ export interface Route {
 
 export const routes: Route[] = [
   { path: '/', label: 'Home', pageFile: 'HomePage' },
+  { path: '/landing', label: 'Landing', pageFile: 'LandingPage' },
 ];
-- 
2.49.1


From e6210d0059e308314f813de5217e23bcd6f96aad Mon Sep 17 00:00:00 2001
From: kudinDmitriyUp <kudin.dmitriy.up@gmail.com>
Date: Thu, 25 Jun 2026 07:32:56 +0000
Subject: [PATCH 2/2] Bob AI: Populate src/pages/LandingPage.tsx (snippet
 builder, 2 sections)

---
 src/pages/LandingPage.tsx | 57 +++++++++++----------------------------
 1 file changed, 15 insertions(+), 42 deletions(-)

diff --git a/src/pages/LandingPage.tsx b/src/pages/LandingPage.tsx
index 837c632..31edb7f 100644
--- a/src/pages/LandingPage.tsx
+++ b/src/pages/LandingPage.tsx
@@ -1,46 +1,19 @@
-import React from 'react';
-import { routes } from "@/routes";
-import NavbarCentered from "@/components/ui/NavbarCentered";
-import FloatingGradientBackground from "@/components/ui/FloatingGradientBackground";
-import HeroBillboard from "@/components/sections/hero/HeroBillboard";
-import AboutText from "@/components/sections/about/AboutText";
-import FooterMinimal from "@/components/sections/footer/FooterMinimal";
+import Button from "@/components/ui/Button";
+import HeroBackgroundSlot from "@/components/ui/HeroBackgroundSlot";
+import TextAnimation from "@/components/ui/TextAnimation";
+import ImageOrVideo from "@/components/ui/ImageOrVideo";
+import AutoFillText from "@/components/ui/AutoFillText";
+import GridOrCarousel from "@/components/ui/GridOrCarousel";
+import ScrollReveal from "@/components/ui/ScrollReveal";
 
 export default function LandingPage() {
   return (
-    <div className="relative min-h-screen bg-background text-foreground overflow-hidden">
-      <FloatingGradientBackground position="fixed" />
-      
-      <div className="relative z-10 flex flex-col min-h-screen">
-        <NavbarCentered
-          logo="The Dollhouse"
-          navItems={routes.map((r) => ({ name: r.label, href: r.path }))}
-          ctaButton={{ text: "Enter Now", href: "/home" }}
-        />
-        
-        <main className="flex-grow">
-          <HeroBillboard
-            tag="Welcome"
-            title="The Dollhouse Collective"
-            description="Step into a curated world of style, beauty, and modern aesthetics. Your journey begins here."
-            primaryButton={{ text: "Enter Website", href: "/home" }}
-            secondaryButton={{ text: "Join the Club", href: "/join" }}
-            imageSrc="https://images.unsplash.com/photo-1490481651871-ab68de25d43d?q=80&w=2070&auto=format&fit=crop"
-          />
-          
-          <div className="py-24 bg-card text-card-foreground">
-            <AboutText
-              title="More than just a brand, it is a lifestyle. Discover our carefully curated selections designed to elevate your everyday aesthetic."
-              primaryButton={{ text: "Read Our Story", href: "/about" }}
-            />
-          </div>
-        </main>
-
-        <FooterMinimal
-          brand="The Dollhouse Collective"
-          copyright="© 2024 The Dollhouse Collective. All rights reserved."
-        />
-      </div>
-    </div>
+    <>
+      <div data-webild-section="HeroBrand"><section aria-label="Hero section" className="relative w-full h-svh overflow-hidden flex flex-col justify-end mb-20"><HeroBackgroundSlot /><ImageOrVideo imageSrc="https://img.freepik.com/free-photo/beautiful-woman-with-long-straight-blonde-hair_273609-16690.jpg" className="absolute inset-0 w-full h-full object-cover rounded-none" /><div className="absolute z-10 w-full h-[50svh] md:h-[75svh] left-0 bottom-0 backdrop-blur-xl mask-[linear-gradient(to_bottom,transparent,black_60%)]" aria-hidden="true" /><div className="relative z-10 w-content-width mx-auto pb-5"><div className="flex flex-col"><div className="w-full flex flex-col md:flex-row md:justify-between items-start md:items-end gap-3 md:gap-5"><TextAnimation text="Step into the ultimate luxury hair experience. Discover premium extensions designed for the dolls who demand effortless glamour and unmatched quality." variant="fade-blur" gradientText={false} tag="p" className="w-full md:w-1/2 text-lg md:text-2xl text-balance font-normal text-white leading-snug" /><div className="w-full md:w-1/2 flex justify-start md:justify-end"><div className="flex flex-wrap gap-3"><Button text="Enter The Dollhouse" href="/shop" variant="primary" /><Button text="View Collections" href="/collections" variant="secondary" animationDelay={0.1} /></div></div></div><AutoFillText className="font-semibold text-white">The Dollhouse Collective</AutoFillText></div></div></section></div>
+      <div data-webild-section="FeaturesMediaGrid"><section aria-label="Features section" className="py-20"><div className="flex flex-col gap-8 md:gap-10"><div className="flex flex-col items-center w-content-width mx-auto gap-2"><div className="px-3 py-1 mb-1 text-sm card rounded w-fit"><p>The Dollhouse</p></div><TextAnimation text="Step Into The Dollhouse" variant="fade" gradientText={true} tag="h2" className="md:max-w-8/10 text-6xl 2xl:text-7xl leading-[1.15] font-semibold text-center text-balance" /><TextAnimation text="Discover luxury hair extensions designed for the dolls who demand confidence, quality, and effortless glamour." variant="fade" gradientText={false} tag="p" className="md:max-w-7/10 text-lg md:text-xl leading-snug text-center text-balance" /><div className="flex flex-wrap justify-center gap-3 mt-2 md:mt-3"><Button text="Enter Boutique" href="/shop" variant="primary" /><Button text="View Collections" href="/collections" variant="secondary" animationDelay={0.1} /></div></div><ScrollReveal variant="fade"><GridOrCarousel><div key="Premium Extensions" className="flex flex-col gap-4 xl:gap-5 2xl:gap-6 h-full"><div className="aspect-square overflow-hidden"><ImageOrVideo imageSrc="https://img.freepik.com/premium-photo/beautiful-woman-with-long-straight-blonde-hair_273443-1636.jpg" className="rounded" /></div><div className="flex flex-col gap-1"><h3 className="text-3xl font-semibold leading-snug text-balance">Premium Extensions</h3><p className="text-base leading-snug text-balance">Ethically sourced, 100% virgin hair for a flawless, natural blend.</p></div></div>
+<div key="Effortless Glamour" className="flex flex-col gap-4 xl:gap-5 2xl:gap-6 h-full"><div className="aspect-square overflow-hidden"><ImageOrVideo imageSrc="https://img.freepik.com/free-photo/portrait-beautiful-young-woman-with-long-wavy-hair_158595-5026.jpg" className="rounded" /></div><div className="flex flex-col gap-1"><h3 className="text-3xl font-semibold leading-snug text-balance">Effortless Glamour</h3><p className="text-base leading-snug text-balance">Transform your look instantly with our signature seamless clip-ins.</p></div></div>
+<div key="The Doll Lifestyle" className="flex flex-col gap-4 xl:gap-5 2xl:gap-6 h-full"><div className="aspect-square overflow-hidden"><ImageOrVideo imageSrc="https://img.freepik.com/premium-photo/fashion-portrait-young-elegant-woman_1301-7622.jpg" className="rounded" /></div><div className="flex flex-col gap-1"><h3 className="text-3xl font-semibold leading-snug text-balance">The Doll Lifestyle</h3><p className="text-base leading-snug text-balance">More than just hair—it's a statement of confidence and high fashion.</p></div></div>
+<div key="Exclusive Textures" className="flex flex-col gap-4 xl:gap-5 2xl:gap-6 h-full"><div className="aspect-square overflow-hidden"><ImageOrVideo imageSrc="https://img.freepik.com/free-photo/beautiful-brunette-woman-with-long-wavy-hair_158595-4988.jpg" className="rounded" /></div><div className="flex flex-col gap-1"><h3 className="text-3xl font-semibold leading-snug text-balance">Exclusive Textures</h3><p className="text-base leading-snug text-balance">From silky straight to voluminous waves, find your perfect match.</p></div></div></GridOrCarousel></ScrollReveal></div></section></div>
+    </>
   );
-}
\ No newline at end of file
+}
-- 
2.49.1