mirror of
https://github.com/MODSetter/SurfSense.git
synced 2026-05-29 19:35:20 +02:00
chore: suggested changes
This commit is contained in:
DESKTOP-RTLN3BA\$punk
parent
6b88c920c3
commit
45f306d890
5 changed files with 202 additions and 14 deletions
|
|
@ -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>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
188
surfsense_web/components/homepage/footer-new.tsx
Normal file
188
surfsense_web/components/homepage/footer-new.tsx
Normal file
|
|
@ -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">
|
||||
© 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>
|
||||
);
|
||||
}
|
||||
|
|
@ -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
|
||||
</Link>
|
||||
Start Free Trial
|
||||
</Link> */}
|
||||
</div>
|
||||
<div
|
||||
ref={containerRef}
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -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(
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue