Update src/app/contact/page.tsx

src/app/contact/page.tsx

@@ -6,6 +6,7 @@ import FeatureBento from '@/components/sections/feature/FeatureBento';
 import FooterBase from '@/components/sections/footer/FooterBase';
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
 import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
+import { Mail } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -25,22 +26,10 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleApple
       navItems={[
-        {
-          name: "Home",
-          id: "/",
-        },
-        {
-          name: "Shop",
-          id: "/shop",
-        },
-        {
-          name: "Mission",
-          id: "/mission",
-        },
-        {
-          name: "Contact",
-          id: "/contact",
-        },
+        { name: "Home", id: "/" },
+        { name: "Shop", id: "/shop" },
+        { name: "Mission", id: "/mission" },
+        { name: "Contact", id: "/contact" },
       ]}
       brandName="SMILETABS"
     />
@@ -51,9 +40,7 @@ export default function LandingPage() {
       useInvertedBackground={false}
       title="Get In Touch"
       description={[
-        "We love hearing from our community.",
-        "Reach out to us for any inquiries.",
-      ]}
+        "We love hearing from our community.",        "Reach out to us for any inquiries."]}
     />
   </div>
 
@@ -64,6 +51,10 @@ export default function LandingPage() {
       useInvertedBackground={false}
       title="Support Hub"
       description="We are here to help."
+      features={[
+        { title: "Email", description: "Contact us.", bentoComponent: "reveal-icon", icon: Mail },
+        { title: "Support", description: "Help center.", bentoComponent: "reveal-icon", icon: Mail },
+      ]}
     />
   </div>
 
@@ -71,29 +62,15 @@ export default function LandingPage() {
       <FooterBase
       columns={[
         {
-          title: "Shop",
-          items: [
-            {
-              label: "All Products",
-              href: "/shop",
-            },
-            {
-              label: "New Arrivals",
-              href: "/shop",
-            },
+          title: "Shop",          items: [
+            { label: "All Products", href: "/shop" },
+            { label: "New Arrivals", href: "/shop" },
           ],
         },
         {
-          title: "Support",
-          items: [
-            {
-              label: "FAQ",
-              href: "/faq",
-            },
-            {
-              label: "Contact",
-              href: "/contact",
-            },
+          title: "Support",          items: [
+            { label: "FAQ", href: "/faq" },
+            { label: "Contact", href: "/contact" },
           ],
         },
       ]}