Bob AI: Add metric section after contact form

src/app/globals.css

@@ -4,14 +4,13 @@
   /* Base units */
   /* --vw is set by ThemeProvider */
 
-  --background: #efebe5;;
+  --background: #f0e6e6;;
-  --card: #f7f2ea;;
+  --card: #e6dada;;
   --foreground: #000000;;
-  --primary-cta: #000000;;
+  --primary-cta: #800080;;
-  --secondary-cta: #ffffff;;
+  --secondary-cta: #ff0000;;
-  --accent: #ffffff;;
+  --accent: #ff0000;;
-  --background-accent: #e1b875;;
+  --background-accent: #e6dada;;
-
   /* Base spacing units */
   --vw-0_25: calc(var(--vw) * 0.25);
   --vw-0_5: calc(var(--vw) * 0.5);

src/app/page.tsx

@@ -2,14 +2,14 @@
 
 import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
 import HeroBillboard from '@/components/sections/hero/HeroBillboard';
-import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
 import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
 import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
 import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
 import ContactSplit from '@/components/sections/contact/ContactSplit';
-import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import { BookOpen, Mail } from "lucide-react";
+import FooterBase from '@/components/sections/footer/FooterBase';
+import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
 
 export default function LandingPage() {
   return (
@@ -60,22 +60,6 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="about" data-section="about">
-        <TextSplitAbout
-          title="About Chill Time"
-          description={[
-            "Chill Time is more than just a book club—it's a sanctuary for readers who believe in the transformative power of stories. Founded on the belief that literature connects souls across time and space, we create a welcoming space where book enthusiasts of all backgrounds can gather.",            "From contemporary bestsellers to timeless classics, we celebrate diverse voices and genres. Our monthly selections are carefully curated to spark meaningful conversations, challenge perspectives, and inspire personal growth through shared reading experiences.",            "Join us as we turn pages, share insights, and build a thriving community united by our love of books and the remarkable journeys they take us on."
-          ]}
-          useInvertedBackground="invertDefault"
-          showBorder={true}
-          buttons={[
-            {
-              text: "Learn More",              href: "https://example.com"
-            }
-          ]}
-        />
-      </div>
-
       <div id="features" data-section="features">
         <FeatureCardTwentyThree
           title="Featured Reads"
@@ -164,47 +148,59 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="footer" data-section="footer">
+      <div id="metric_card_one" data-section="metric_card_one">
-        <FooterLogoEmphasis
+        <MetricCardOne
-          logoText="Chill Time"
+          carouselMode="auto"
-          columns={[
+          gridVariant="uniform-all-items-equal"
-            {
+          animationType="none"
-              items: [
+          title="Relaxation Levels"
-                { label: "About Us", href: "about" },
+          description="Explore the impact of our tips on reducing stress and improving well-being."
-                { label: "Our Mission", href: "about" },
+          tag="Metrics"
-                { label: "Community", href: "testimonial" }
+          buttons={[{ label: "View Tips", href: "#" }, { label: "Join Community", href: "#" }]}
-              ]
+          textboxLayout="default"
-            },
+          useInvertedBackground="noInvert"
-            {
-              items: [
-                { label: "Current Books", href: "features" },
-                { label: "Reading Lists", href: "features" },
-                { label: "Recommendations", href: "features" }
-              ]
-            },
-            {
-              items: [
-                { label: "Upcoming Events", href: "metrics" },
-                { label: "Calendar", href: "metrics" },
-                { label: "Discussions", href: "metrics" }
-              ]
-            },
-            {
-              items: [
-                { label: "Contact Us", href: "contact" },
-                { label: "Newsletter", href: "contact" },
-                { label: "Privacy Policy", href: "#" }
-              ]
-            },
-            {
-              items: [
-                { label: "Twitter", href: "https://twitter.com" },
-                { label: "Instagram", href: "https://instagram.com" },
-                { label: "Facebook", href: "https://facebook.com" }
-              ]
-            }
-          ]}
         />
+      </div>      <div id="footer" data-section="footer">
+      <FooterBase
+      columns={[
+      {
+      items: [
+      { label: "About Us", href: "about" },
+      { label: "Our Mission", href: "about" },
+      { label: "Community", href: "testimonial" }
+      ]
+      },
+      {
+      items: [
+      { label: "Current Books", href: "features" },
+      { label: "Reading Lists", href: "features" },
+      { label: "Recommendations", href: "features" }
+      ]
+      },
+      {
+      items: [
+      { label: "Upcoming Events", href: "metrics" },
+      { label: "Calendar", href: "metrics" },
+      { label: "Discussions", href: "metrics" }
+      ]
+      },
+      {
+      items: [
+      { label: "Contact Us", href: "contact" },
+      { label: "Newsletter", href: "contact" },
+      { label: "Privacy Policy", href: "#" }
+      ]
+      },
+      {
+      items: [
+      { label: "Twitter", href: "https://twitter.com" },
+      { label: "Instagram", href: "https://instagram.com" },
+      { label: "Facebook", href: "https://facebook.com" }
+      ]
+      }
+      ]}
+      copyrightText="© 2025 | Webild"
+      />
       </div>
     </ThemeProvider>
   );