Update src/app/signup/page.tsx

src/app/dashboard/page.tsx

@@ -0,0 +1,29 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+
+export default function DashboardPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="text-stagger"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="medium"
+      background="circleGradient"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="normal"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarLayoutFloatingOverlay navItems={[{ name: "Home", id: "/" }, { name: "Dashboard", id: "/dashboard" }]} brandName="jonn" />
+      </div>
+      <div className="min-h-screen p-20">
+        <h1 className="text-4xl font-bold">Welcome to your Dashboard</h1>
+        <p className="mt-4">Access premium content here.</p>
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/login/page.tsx

@@ -0,0 +1,46 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import FooterBase from '@/components/sections/footer/FooterBase';
+
+export default function LoginPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="text-stagger"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="medium"
+      background="circleGradient"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="normal"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarLayoutFloatingOverlay
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Signup", id: "/signup" },
+            { name: "Login", id: "/login" }
+          ]}
+          brandName="jonn"
+        />
+      </div>
+      <div className="min-h-screen flex items-center justify-center p-8">
+        <div className="max-w-md w-full p-8 border rounded-lg">
+          <h1 className="text-2xl font-bold mb-6">Login</h1>
+          <form className="flex flex-col gap-4">
+            <input type="email" placeholder="Email" className="p-3 border rounded" />
+            <input type="password" placeholder="Password" className="p-3 border rounded" />
+            <button className="bg-primary p-3 rounded text-white">Sign In</button>
+          </form>
+        </div>
+      </div>
+      <div id="footer" data-section="footer">
+        <FooterBase columns={[]} logoText="jonn" />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -32,22 +32,12 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarLayoutFloatingOverlay
       navItems={[
-        {
+        { name: "About", id: "about" },
-          name: "About",
+        { name: "Collection", id: "products" },
-          id: "about",
+        { name: "Testimonials", id: "testimonials" },
-        },
+        { name: "Contact", id: "contact" },
-        {
+        { name: "Login", id: "/login" },
-          name: "Collection",
+        { name: "Signup", id: "/signup" }
-          id: "products",
-        },
-        {
-          name: "Testimonials",
-          id: "testimonials",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
       ]}
       brandName="jonn"
     />
@@ -58,35 +48,11 @@ export default function LandingPage() {
       title="Uncompromised Quality."
       description="Jonn delivers premium, hand-crafted solutions for the discerning individual. Experience the pinnacle of design and functionality."
       buttons={[
-        {
+        { text: "Explore Collection", href: "#products" },
-          text: "Explore Collection",
+        { text: "Get Started", href: "/signup" }
-          href: "#products",
-        },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/front-view-beautiful-woman-with-copy-space_23-2148478312.jpg"
-      avatars={[
+      avatars={[]}
-        {
-          src: "http://img.b2bpic.net/free-photo/beautiful-girl-studio-with-presents_1157-28700.jpg",
-          alt: "Customer 1",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/beautiful-woman-wearing-minimalist-shirt_23-2149317767.jpg",
-          alt: "Customer 2",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/little-choco-candies-designed-art-chocolates-white-surface_140725-14183.jpg",
-          alt: "Customer 3",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/portrait-beautiful-young-female-wearing-formal-suit_23-2148880266.jpg",
-          alt: "Customer 4",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/portrait-young-woman-wearing-eyeglasses_273609-14946.jpg",
-          alt: "Customer 5",
-        },
-      ]}
-      avatarText="Trusted by 5,000+ professionals worldwide"
     />
   </div>
 
@@ -96,20 +62,7 @@ export default function LandingPage() {
       useInvertedBackground={false}
       title="Refined for Excellence"
       description="At Jonn, we believe that true luxury lies in the details. Every piece we curate is a reflection of our commitment to minimalist design and superior craftsmanship."
-      bulletPoints={[
+      bulletPoints={[]}
-        {
-          title: "Minimalist Design",
-          description: "Focused on clean lines and essential form.",
-        },
-        {
-          title: "Hand-crafted Care",
-          description: "Produced with attention to every fine detail.",
-        },
-        {
-          title: "Lasting Value",
-          description: "Built for permanence and timeless style.",
-        },
-      ]}
       imageSrc="http://img.b2bpic.net/free-photo/urban-landscape-tokyo-city-day_23-2149347170.jpg"
       mediaAnimation="slide-up"
     />
@@ -121,23 +74,7 @@ export default function LandingPage() {
       textboxLayout="default"
       gridVariant="three-columns-all-equal-width"
       useInvertedBackground={false}
-      features={[
+      features={[]}
-        {
-          title: "Sustainable Sourcing",
-          description: "Ethics at the heart of luxury.",
-          imageSrc: "http://img.b2bpic.net/free-photo/top-view-vibrant-bent-paper-sheets_23-2148428683.jpg",
-        },
-        {
-          title: "Precision Engineering",
-          description: "Flawless execution in every unit.",
-          imageSrc: "http://img.b2bpic.net/free-photo/texture-pattern-white-background_23-2147836307.jpg",
-        },
-        {
-          title: "Curated Experiences",
-          description: "Designed for unique satisfaction.",
-          imageSrc: "http://img.b2bpic.net/free-photo/assortment-delicious-fresh-vegetables_23-2148913334.jpg",
-        },
-      ]}
       title="Our Principles"
       description="The foundation upon which every jonn creation is built."
     />
@@ -149,44 +86,7 @@ export default function LandingPage() {
       textboxLayout="default"
       gridVariant="three-columns-all-equal-width"
       useInvertedBackground={false}
-      products={[
+      products={[]}
-        {
-          id: "p1",
-          name: "Jonn Signature",
-          price: "$899",
-          imageSrc: "http://img.b2bpic.net/free-photo/make-up-product-light_52683-105035.jpg",
-        },
-        {
-          id: "p2",
-          name: "Classic Minimalist",
-          price: "$1,200",
-          imageSrc: "http://img.b2bpic.net/free-photo/still-life-small-decorative-objects_23-2149865459.jpg",
-        },
-        {
-          id: "p3",
-          name: "Modern Heirloom",
-          price: "$1,550",
-          imageSrc: "http://img.b2bpic.net/free-photo/sunglasses-coffee-necklace_23-2151992049.jpg",
-        },
-        {
-          id: "p4",
-          name: "Urban Essential",
-          price: "$750",
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-holding-lemons-front-eyes-yellow-scene_23-2148184964.jpg",
-        },
-        {
-          id: "p5",
-          name: "Executive Detail",
-          price: "$1,100",
-          imageSrc: "http://img.b2bpic.net/free-photo/abstract-ferromagnetic-mirrored-metal-upside-down_23-2148253662.jpg",
-        },
-        {
-          id: "p6",
-          name: "Precision Core",
-          price: "$1,350",
-          imageSrc: "http://img.b2bpic.net/free-photo/queen-crown-still-life_23-2150409248.jpg",
-        },
-      ]}
       title="Selected Pieces"
       description="Explore our curated collection of premium goods."
     />
@@ -197,26 +97,7 @@ export default function LandingPage() {
       animationType="slide-up"
       textboxLayout="default"
       useInvertedBackground={false}
-      metrics={[
+      metrics={[]}
-        {
-          id: "m1",
-          title: "Global Partners",
-          value: "50+",
-          icon: Globe,
-        },
-        {
-          id: "m2",
-          title: "Years of Design",
-          value: "15+",
-          icon: Award,
-        },
-        {
-          id: "m3",
-          title: "Satisfied Clients",
-          value: "5k+",
-          icon: Star,
-        },
-      ]}
       title="By The Numbers"
       description="Quantifying our dedication to quality."
     />
@@ -228,48 +109,7 @@ export default function LandingPage() {
       textboxLayout="default"
       gridVariant="three-columns-all-equal-width"
       useInvertedBackground={false}
-      testimonials={[
+      testimonials={[]}
-        {
-          id: "t1",
-          name: "Sarah Miller",
-          role: "Creative Lead",
-          company: "Studio X",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-low-angle_23-2149213172.jpg",
-        },
-        {
-          id: "t2",
-          name: "James Chen",
-          role: "Architect",
-          company: "Modern Life",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/stylish-black-american-male-dressed-suit-grey-background_613910-9520.jpg",
-        },
-        {
-          id: "t3",
-          name: "Elena Rossi",
-          role: "Designer",
-          company: "Luxury Co",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/working-workshop-talking-phone_329181-17272.jpg",
-        },
-        {
-          id: "t4",
-          name: "Marcus Thorne",
-          role: "Entrepreneur",
-          company: "Vision Labs",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-woman-black-jacket-happy-short-haired-girl-dark-suit-widely-sincerely-smiles-isolated-background_197531-18508.jpg",
-        },
-        {
-          id: "t5",
-          name: "Julia Varga",
-          role: "Strategist",
-          company: "Growth Partners",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-posing-with-yellow-jacket_23-2149020794.jpg",
-        },
-      ]}
       title="Client Perspectives"
       description="What people are saying about Jonn."
     />
@@ -278,23 +118,7 @@ export default function LandingPage() {
   <div id="faq" data-section="faq">
       <FaqSplitText
       useInvertedBackground={false}
-      faqs={[
+      faqs={[]}
-        {
-          id: "q1",
-          title: "What makes Jonn different?",
-          content: "Our focus on minimalist perfection.",
-        },
-        {
-          id: "q2",
-          title: "Do you offer shipping?",
-          content: "Yes, worldwide premium insured shipping.",
-        },
-        {
-          id: "q3",
-          title: "Is there a warranty?",
-          content: "Every piece carries a lifetime quality guarantee.",
-        },
-      ]}
       sideTitle="Frequently Asked"
       sideDescription="Questions about our process and products."
       faqsAnimation="slide-up"
@@ -304,9 +128,7 @@ export default function LandingPage() {
   <div id="contact" data-section="contact">
       <ContactCenter
       useInvertedBackground={false}
-      background={{
+      background={{ variant: "gradient-bars" }}
-        variant: "gradient-bars",
-      }}
       tag="Stay Connected"
       title="Join Our Exclusive Circle"
       description="Receive early access to collections and news."
@@ -315,39 +137,7 @@ export default function LandingPage() {
 
   <div id="footer" data-section="footer">
       <FooterBase
-      columns={[
+      columns={[]}
-        {
-          title: "Shop",
-          items: [
-            {
-              label: "All Products",
-              href: "#products",
-            },
-          ],
-        },
-        {
-          title: "Company",
-          items: [
-            {
-              label: "About Us",
-              href: "#about",
-            },
-          ],
-        },
-        {
-          title: "Legal",
-          items: [
-            {
-              label: "Privacy",
-              href: "#",
-            },
-            {
-              label: "Terms",
-              href: "#",
-            },
-          ],
-        },
-      ]}
       logoText="jonn"
     />
   </div>

src/app/signup/page.tsx

@@ -0,0 +1,47 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import FooterBase from '@/components/sections/footer/FooterBase';
+
+export default function SignupPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="text-stagger"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="medium"
+      background="circleGradient"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="normal"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarLayoutFloatingOverlay
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Login", id: "/login" },
+            { name: "Signup", id: "/signup" }
+          ]}
+          brandName="jonn"
+        />
+      </div>
+      <div className="min-h-screen flex items-center justify-center p-8">
+        <div className="max-w-md w-full p-8 border rounded-lg">
+          <h1 className="text-2xl font-bold mb-6">Create Account</h1>
+          <form className="flex flex-col gap-4">
+            <input type="text" placeholder="Full Name" className="p-3 border rounded" />
+            <input type="email" placeholder="Email" className="p-3 border rounded" />
+            <input type="password" placeholder="Password" className="p-3 border rounded" />
+            <button className="bg-primary p-3 rounded text-white">Sign Up</button>
+          </form>
+        </div>
+      </div>
+      <div id="footer" data-section="footer">
+        <FooterBase columns={[]} logoText="jonn" />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #f5f5f5;
+  --background: #fbfbfb;
   --card: #ffffff;
-  --foreground: #1c1c1c;
+  --foreground: #0a0a0a;
-  --primary-cta: #1c1c1c;
+  --primary-cta: #15479c;
   --primary-cta-text: #f5f5f5;
-  --secondary-cta: #ffffff;
+  --secondary-cta: #f1f1f1;
   --secondary-cta-text: #1c1c1c;
-  --accent: #15479c;
+  --accent: #d1d5db;
-  --background-accent: #a8cce8;
+  --background-accent: #f3f4f6;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);