Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -31,14 +31,10 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarLayoutFloatingOverlay
       navItems={[
-        {
+        { name: "Home", id: "hero" },
-          name: "Home",          id: "hero"},
+        { name: "Features", id: "features" },
-        {
+        { name: "FAQ", id: "faq" },
-          name: "Features",          id: "features"},
+        { name: "Contact", id: "contact" },
-        {
-          name: "FAQ",          id: "faq"},
-        {
-          name: "Contact",          id: "contact"},
       ]}
       brandName="GenSentence"
     />
@@ -46,20 +42,14 @@ export default function LandingPage() {
 
   <div id="hero" data-section="hero">
       <HeroSplitDualMedia
-      background={{
+      background={{ variant: "gradient-bars" }}
-        variant: "gradient-bars"}}
       title="Transform Words into Sentences Instantly"
       description="Harness the power of AI to generate clean, beginner-friendly sentences from your word lists. Enter your words and let the intelligence do the rest."
       tag="AI Sentence Engine"
-      buttons={[
+      buttons={[{ text: "Start Generating", href: "#contact" }]}
-        {
-          text: "Start Generating",          href: "#contact"},
-      ]}
       mediaItems={[
-        {
+        { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3g8r88", imageAlt: "ai interface holographic dark" },
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3g8r88",          imageAlt: "ai interface holographic dark"},
+        { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=1wakbu&_wi=1", imageAlt: "abstract 3d shapes dark background" }
-        {
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=1wakbu&_wi=1",          imageAlt: "abstract 3d shapes dark background"}
       ]}
       mediaAnimation="slide-up"
       rating={5}
@@ -74,12 +64,9 @@ export default function LandingPage() {
       gridVariant="uniform-all-items-equal"
       useInvertedBackground={false}
       features={[
-        {
+        { title: "Simple Generation", description: "Just type words and click go.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=xozeam", imageAlt: "open book icon minimal" },
-          title: "Simple Generation",          description: "Just type words and click go.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=xozeam",          imageAlt: "open book icon minimal"},
+        { title: "AI Powered", description: "High quality models ensure accuracy.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z8rjv0", imageAlt: "magic wand icon minimal" },
-        {
+        { title: "Fast Results", description: "Instant processing for your workflow.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6ybd7q", imageAlt: "checkmark icon clean modern" },
-          title: "AI Powered",          description: "High quality models ensure accuracy.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z8rjv0",          imageAlt: "magic wand icon minimal"},
-        {
-          title: "Fast Results",          description: "Instant processing for your workflow.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6ybd7q",          imageAlt: "checkmark icon clean modern"},
       ]}
       title="Why Choose Us"
       description="We offer a streamlined experience designed for clarity and rapid production of simple sentences."
@@ -92,15 +79,9 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       metrics={[
-        {
+        { id: "m1", title: "Sentences Created", value: "1M+", icon: Sparkles },
-          id: "m1",          title: "Sentences Created",          value: "1M+",          icon: Sparkles,
+        { id: "m2", title: "Happy Users", value: "50K", icon: Users },
-        },
+        { id: "m3", title: "Accuracy Rate", value: "99.9%", icon: Target },
-        {
-          id: "m2",          title: "Happy Users",          value: "50K",          icon: Users,
-        },
-        {
-          id: "m3",          title: "Accuracy Rate",          value: "99.9%",          icon: Target,
-        },
       ]}
       title="Our Impact"
       description="Milestones we have achieved so far."
@@ -114,18 +95,12 @@ export default function LandingPage() {
       gridVariant="one-large-left-three-stacked-right"
       useInvertedBackground={false}
       products={[
-        {
+        { id: "p1", name: "Daily Routines", price: "Free", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9cgxgx" },
-          id: "p1",          name: "Daily Routines",          price: "Free",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9cgxgx"},
+        { id: "p2", name: "Educational", price: "Free", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ujnd6g" },
-        {
+        { id: "p3", name: "Creative Writing", price: "Free", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=89gikr" },
-          id: "p2",          name: "Educational",          price: "Free",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ujnd6g"},
+        { id: "p4", name: "Work Mails", price: "Free", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=vjjqim" },
-        {
+        { id: "p5", name: "Conversational", price: "Free", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z5qcmc" },
-          id: "p3",          name: "Creative Writing",          price: "Free",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=89gikr"},
+        { id: "p6", name: "Professional", price: "Free", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9vvkee" },
-        {
-          id: "p4",          name: "Work Mails",          price: "Free",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=vjjqim"},
-        {
-          id: "p5",          name: "Conversational",          price: "Free",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z5qcmc"},
-        {
-          id: "p6",          name: "Professional",          price: "Free",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9vvkee"},
       ]}
       title="Example Output Categories"
       description="Check how your words become sentences."
@@ -138,21 +113,11 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       testimonials={[
-        {
+        { id: "1", name: "Alice", handle: "@alice", testimonial: "Amazing tool!", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=quwfee" },
-          id: "1",          name: "Alice",          handle: "@alice",          testimonial: "Amazing tool!",          rating: 5,
+        { id: "2", name: "Bob", handle: "@bob", testimonial: "Very easy to use.", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=i79lab" },
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=quwfee"},
+        { id: "3", name: "Charlie", handle: "@char", testimonial: "Perfect for school.", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qcbhsp" },
-        {
+        { id: "4", name: "Diana", handle: "@diana", testimonial: "AI is so fast.", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=yd39o5" },
-          id: "2",          name: "Bob",          handle: "@bob",          testimonial: "Very easy to use.",          rating: 5,
+        { id: "5", name: "Edward", handle: "@ed", testimonial: "Highly recommended.", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=2ng59b" },
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=i79lab"},
-        {
-          id: "3",          name: "Charlie",          handle: "@char",          testimonial: "Perfect for school.",          rating: 5,
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qcbhsp"},
-        {
-          id: "4",          name: "Diana",          handle: "@diana",          testimonial: "AI is so fast.",          rating: 5,
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=yd39o5"},
-        {
-          id: "5",          name: "Edward",          handle: "@ed",          testimonial: "Highly recommended.",          rating: 5,
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=2ng59b"},
       ]}
       showRating={true}
       title="User Reviews"
@@ -164,12 +129,9 @@ export default function LandingPage() {
       <FaqSplitText
       useInvertedBackground={false}
       faqs={[
-        {
+        { id: "f1", title: "How does it work?", content: "You provide words, we use AI to form sentences." },
-          id: "f1",          title: "How does it work?",          content: "You provide words, we use AI to form sentences."},
+        { id: "f2", title: "Is it free?", content: "Yes, basic generation is free." },
-        {
+        { id: "f3", title: "Can I use for work?", content: "Absolutely." },
-          id: "f2",          title: "Is it free?",          content: "Yes, basic generation is free."},
-        {
-          id: "f3",          title: "Can I use for work?",          content: "Absolutely."},
       ]}
       sideTitle="Common Questions"
       sideDescription="Find answers here."
@@ -183,13 +145,9 @@ export default function LandingPage() {
       title="Try it now"
       description="Enter your words below and hit Generate."
       inputs={[
-        {
+        { name: "words", type: "text", placeholder: "apple, travel, happy", required: true },
-          name: "words",          type: "text",          placeholder: "apple, travel, happy",          required: true,
-        },
       ]}
-      textarea={{
+      textarea={{ name: "output", placeholder: "Generated sentences will appear here...", rows: 6 }}
-        name: "output",        placeholder: "Generated sentences will appear here...",        rows: 6,
-      }}
       buttonText="Generate Sentences"
       imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=1wakbu&_wi=2"
     />
@@ -198,22 +156,8 @@ export default function LandingPage() {
   <div id="footer" data-section="footer">
       <FooterLogoEmphasis
       columns={[
-        {
+        { items: [{ label: "About", href: "#" }, { label: "Terms", href: "#" }] },
-          items: [
+        { items: [{ label: "Support", href: "#" }, { label: "Privacy", href: "#" }] },
-            {
-              label: "About",              href: "#"},
-            {
-              label: "Terms",              href: "#"},
-          ],
-        },
-        {
-          items: [
-            {
-              label: "Support",              href: "#"},
-            {
-              label: "Privacy",              href: "#"},
-          ],
-        },
       ]}
       logoText="GenSentence"
     />

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #000000;
+  --background: #0a0a0a;
-  --card: #0c0c0c;
+  --card: #1a1a1a;
-  --foreground: #ffffff;
+  --foreground: #ffffffe6;
-  --primary-cta: #cee7ff;
+  --primary-cta: #e6e6e6;
   --primary-cta-text: #000000;
-  --secondary-cta: #000000;
+  --secondary-cta: #1a1a1a;
   --secondary-cta-text: #ffffff;
-  --accent: #535353;
+  --accent: #737373;
-  --background-accent: #CEE7FF;
+  --background-accent: #737373;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);