chore: suggested changes

surfsense_web/app/(home)/layout.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { Footer } from "@/components/homepage/footer";
+import { FooterNew } from "@/components/homepage/footer-new";
 import { Navbar } from "@/components/homepage/navbar";
 
 export default function HomePageLayout({ children }: { children: React.ReactNode }) {
@@ -8,7 +8,7 @@ export default function HomePageLayout({ children }: { children: React.ReactNode
 		<main className="min-h-screen bg-gradient-to-b from-gray-50 to-gray-100 text-gray-900 dark:from-black dark:to-gray-900 dark:text-white overflow-x-hidden">
 			<Navbar />
 			{children}
-			<Footer />
+			<FooterNew />
 		</main>
 	);
 }

surfsense_web/components/homepage/footer-new.tsx

@@ -0,0 +1,188 @@
+import Image from "next/image";
+import Link from "next/link";
+import React from "react";
+import {
+  IconBrandTwitter,
+  IconBrandLinkedin,
+  IconBrandGithub,
+  IconBrandDiscord,
+} from "@tabler/icons-react";
+import { Logo } from "@/components/Logo";
+
+export function FooterNew() {
+  const pages = [
+    // {
+    //   title: "All Products",
+    //   href: "#",
+    // },
+    // {
+    //   title: "Studio",
+    //   href: "#",
+    // },
+    // {
+    //   title: "Clients",
+    //   href: "#",
+    // },
+    {
+      title: "Pricing",
+      href: "/pricing",
+    },
+    {
+      title: "Docs",
+      href: "/docs",
+    },
+    // {
+    //   title: "Blog",
+    //   href: "#",
+    // },
+  ];
+
+  const socials = [
+    {
+      title: "Twitter",
+      href: "https://x.com/mod_setter",
+      icon: IconBrandTwitter,
+    },
+    {
+      title: "LinkedIn",
+      href: "https://www.linkedin.com/in/rohan-verma-sde/",
+      icon: IconBrandLinkedin,
+    },
+    {
+      title: "GitHub",
+      href: "https://github.com/MODSetter",
+      icon: IconBrandGithub,
+    },
+    {
+      title: "Discord",
+      href: "https://discord.gg/ejRNvftDp9",
+      icon: IconBrandDiscord,
+    },
+  ];
+  const legals = [
+    {
+      title: "Privacy Policy",
+      href: "/privacy",
+    },
+    {
+      title: "Terms of Service",
+      href: "/terms",
+    },
+    // {
+    //   title: "Cookie Policy",
+    //   href: "#",
+    // },
+  ];
+
+  const signups = [
+    {
+      title: "Sign In",
+      href: "/login",
+    },
+    // {
+    //   title: "Login",
+    //   href: "#",
+    // },
+    // {
+    //   title: "Forgot Password",
+    //   href: "#",
+    // },
+  ];
+  return (
+    <div className="border-t border-neutral-100 dark:border-white/[0.1] px-8 py-20 bg-white dark:bg-neutral-950 w-full relative overflow-hidden">
+      <div className="max-w-7xl mx-auto text-sm text-neutral-500 flex sm:flex-row flex-col justify-between items-start  md:px-8">
+        <div>
+          <div className="mr-0 md:mr-4  md:flex mb-4">
+            <Logo className="h-6 w-6 rounded-md mr-2" />
+            <span className="dark:text-white/90 text-gray-800 text-lg font-bold">SurfSense</span>
+          </div>
+
+          <div className="mt-2 ml-2">
+            &copy; SurfSense 2025. All rights reserved.
+          </div>
+        </div>
+        <div className="grid grid-cols-2 lg:grid-cols-4 gap-10 items-start mt-10 sm:mt-0 md:mt-0">
+          <div className="flex justify-center space-y-4 flex-col w-full">
+            <p className="transition-colors hover:text-text-neutral-800 text-neutral-600 dark:text-neutral-300 font-bold">
+              Pages
+            </p>
+            <ul className="transition-colors hover:text-text-neutral-800 text-neutral-600 dark:text-neutral-300 list-none space-y-4">
+              {pages.map((page, idx) => (
+                <li key={"pages" + idx} className="list-none">
+                  <Link
+                    className="transition-colors hover:text-text-neutral-800 "
+                    href={page.href}
+                  >
+                    {page.title}
+                  </Link>
+                </li>
+              ))}
+            </ul>
+          </div>
+
+          <div className="flex justify-center space-y-4 flex-col">
+            <p className="transition-colors hover:text-text-neutral-800 text-neutral-600 dark:text-neutral-300 font-bold">
+              Socials
+            </p>
+            <ul className="transition-colors hover:text-text-neutral-800 text-neutral-600 dark:text-neutral-300 list-none space-y-4">
+              {socials.map((social, idx) => {
+                const Icon = social.icon;
+                return (
+                  <li key={"social" + idx} className="list-none">
+                    <Link
+                      className="transition-colors hover:text-text-neutral-800 flex items-center gap-2"
+                      href={social.href}
+                      target="_blank"
+                      rel="noopener noreferrer"
+                    >
+                      <Icon className="h-5 w-5" />
+                      {social.title}
+                    </Link>
+                  </li>
+                );
+              })}
+            </ul>
+          </div>
+
+          <div className="flex justify-center space-y-4 flex-col">
+            <p className="transition-colors hover:text-text-neutral-800 text-neutral-600 dark:text-neutral-300 font-bold">
+              Legal
+            </p>
+            <ul className="transition-colors hover:text-text-neutral-800 text-neutral-600 dark:text-neutral-300 list-none space-y-4">
+              {legals.map((legal, idx) => (
+                <li key={"legal" + idx} className="list-none">
+                  <Link
+                    className="transition-colors hover:text-text-neutral-800 "
+                    href={legal.href}
+                  >
+                    {legal.title}
+                  </Link>
+                </li>
+              ))}
+            </ul>
+          </div>
+          <div className="flex justify-center space-y-4 flex-col">
+            <p className="transition-colors hover:text-text-neutral-800 text-neutral-600 dark:text-neutral-300 font-bold">
+              Register
+            </p>
+            <ul className="transition-colors hover:text-text-neutral-800 text-neutral-600 dark:text-neutral-300 list-none space-y-4">
+              {signups.map((auth, idx) => (
+                <li key={"auth" + idx} className="list-none">
+                  <Link
+                    className="transition-colors hover:text-text-neutral-800 "
+                    href={auth.href}
+                  >
+                    {auth.title}
+                  </Link>
+                </li>
+              ))}
+            </ul>
+          </div>
+        </div>
+      </div>
+      <p className="text-center mt-20 text-5xl md:text-9xl lg:text-[12rem] xl:text-[13rem] font-bold bg-clip-text text-transparent bg-gradient-to-b from-neutral-50 dark:from-neutral-950 to-neutral-200 dark:to-neutral-800 inset-x-0">
+        SurfSense
+      </p>
+    </div>
+  );
+}

surfsense_web/components/homepage/hero-section.tsx

@@ -77,14 +77,14 @@ export function HeroSection() {
 					href="/contact"
 					className="group relative z-20 flex h-10 w-full cursor-pointer items-center justify-center space-x-2 rounded-lg bg-black p-px px-4 py-2 text-center text-sm font-semibold leading-6 text-white no-underline transition duration-200 sm:w-52 dark:bg-white dark:text-black"
 				>
-					Start Free Trial
+					Get Started
 				</Link>
-				<Link
+				{/* <Link
 					href="/pricing"
 					className="shadow-input group relative z-20 flex h-10 w-full cursor-pointer items-center justify-center space-x-2 rounded-lg bg-white p-px px-4 py-2 text-sm font-semibold leading-6 text-black no-underline transition duration-200 hover:-translate-y-0.5 sm:w-52 dark:bg-neutral-800 dark:text-white"
 				>
-					Explore
+					Start Free Trial
-				</Link>
+				</Link> */}
 			</div>
 			<div
 				ref={containerRef}

surfsense_web/components/homepage/navbar.tsx

@@ -12,9 +12,9 @@ export const Navbar = () => {
 	const [isScrolled, setIsScrolled] = useState(false);
 
 	const navItems = [
-		{ name: "Home", link: "/" },
+		// { name: "Home", link: "/" },
 		{ name: "Pricing", link: "/pricing" },
-		{ name: "Sign In", link: "/login" },
+		// { name: "Sign In", link: "/login" },
 		{ name: "Docs", link: "/docs" },
 	];
 
@@ -99,10 +99,10 @@ const DesktopNav = ({ navItems, isScrolled }: any) => {
 				</Link>
 				<ThemeTogglerComponent />
 				<Link
-					href="/contact"
+					href="/login"
 					className="hidden rounded-full bg-black px-8 py-2 text-sm font-bold text-white shadow-[0px_-2px_0px_0px_rgba(255,255,255,0.4)_inset] md:block dark:bg-white dark:text-black"
 				>
-					Book a call
+					Sign In
 				</Link>
 			</div>
 		</motion.div>
@@ -188,10 +188,10 @@ const MobileNav = ({ navItems, isScrolled }: any) => {
 								<ThemeTogglerComponent />
 							</div>
 							<Link
-								href="/contact"
+								href="/login"
 								className="w-full rounded-lg bg-black px-8 py-2 font-medium text-white shadow-[0px_-2px_0px_0px_rgba(255,255,255,0.4)_inset] dark:bg-white dark:text-black text-center touch-manipulation"
 							>
-								Book a call
+								Sign In
 							</Link>
 						</motion.div>
 					)}

surfsense_web/components/pricing.tsx

@@ -75,7 +75,7 @@ export function Pricing({
 				<p className="text-muted-foreground text-lg whitespace-pre-line">{description}</p>
 			</div>
 
-			<div className="flex justify-center mb-10">
+			{/* <div className="flex justify-center mb-10">
 				<label
 					htmlFor="billing-toggle"
 					className="relative inline-flex items-center cursor-pointer"
@@ -92,7 +92,7 @@ export function Pricing({
 				<span className="ml-2 font-semibold">
 					Annual billing <span className="text-primary">(Save 20%)</span>
 				</span>
-			</div>
+			</div> */}
 
 			<div
 				className={cn(