songtianlun/prmbr-image-mksaas
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: update site layout, footer, and navigation components

Browse Source
This commit is contained in:
javayhu 2025-02-26 01:31:47 +08:00
parent 59f023e933
commit 9dbddad6e4
9 changed files with 95 additions and 93 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/fonts/bricolage-grotesque-v7-latin-regular.woff2
View File

Binary file not shown.

2
src/assets/fonts/index.ts
View File

@ -2,7 +2,7 @@ import localFont from "next/font/local";
import { Source_Serif_4 } from "next/font/google";
/**
* This file shows how to customize the font by using local font and google font
* This file shows how to customize the font by using local font or google font
*
* [1] use local font
*

2
src/components/auth/login-form.tsx
View File

@ -148,7 +148,7 @@ export const LoginForm = ({ className }: { className?: string }) => {
) : (
""
)}
<span>Login</span>
<span>Sign in</span>
</Button>
</form>
</Form>

2
src/components/auth/register-form.tsx
View File

@ -148,7 +148,7 @@ export const RegisterForm = () => {
) : (
""
)}
<span>Create an account</span>
<span>Sign up</span>
</Button>
</form>
</Form>

2
src/components/icons/icons.tsx
View File

@ -2,6 +2,7 @@ import {
ArrowRightIcon,
BadgeDollarSignIcon,
BookOpenIcon,
Building2Icon,
ChartLineIcon,
ChartNoAxesCombinedIcon,
CircleDollarSignIcon,
@ -120,6 +121,7 @@ export const Icons = {
squareChartGantt: SquareChartGanttIcon,
admin: LockKeyholeIcon,
about: Building2Icon,
github: FaBrandsGitHub,
google: FaBrandsGoogle,

146
src/components/layout/footer.tsx
View File

@ -18,7 +18,7 @@ export function Footer({ className }: React.HTMLAttributes<HTMLElement>) {
return (
<footer className={cn("border-t", className)}>
<Container className="px-4">
<div className="grid grid-cols-2 gap-8 py-12 md:grid-cols-6">
<div className="grid grid-cols-2 gap-8 py-16 md:grid-cols-6">
<div className="flex flex-col items-start col-span-full md:col-span-2">
<div className="space-y-4">
<div className="items-center space-x-2 flex">
@ -30,76 +30,7 @@ export function Footer({ className }: React.HTMLAttributes<HTMLElement>) {
<p className="text-muted-foreground text-base p4-4 md:pr-12">
{siteConfig.tagline}
</p>
<div className="flex items-center gap-2">
{siteConfig.links.github && (
<Link
href={siteConfig.links.github}
target="_blank"
rel="noreferrer"
aria-label="GitHub"
className="inline-flex h-8 w-8 items-center justify-center rounded-md hover:bg-accent hover:text-accent-foreground"
>
<Icons.github className="size-4" aria-hidden="true" />
</Link>
)}
{siteConfig.links.twitter && (
<Link
href={siteConfig.links.twitter}
target="_blank"
rel="noreferrer"
aria-label="Twitter"
className="inline-flex h-8 w-8 items-center justify-center rounded-md hover:bg-accent hover:text-accent-foreground"
>
<Icons.twitter className="size-4" aria-hidden="true" />
</Link>
)}
{siteConfig.links.twitter_cn && (
<Link
href={siteConfig.links.twitter_cn}
target="_blank"
rel="noreferrer"
aria-label="Twitter(CN)"
className="inline-flex h-8 w-8 items-center justify-center rounded-md hover:bg-accent hover:text-accent-foreground"
>
<Icons.twitter className="size-4" aria-hidden="true" />
</Link>
)}
{siteConfig.links.bluesky && (
<Link
href={siteConfig.links.bluesky}
target="_blank"
rel="noreferrer"
aria-label="Bluesky"
className="inline-flex h-8 w-8 items-center justify-center rounded-md hover:bg-accent hover:text-accent-foreground"
>
<Icons.bluesky className="size-4" aria-hidden="true" />
</Link>
)}
{siteConfig.links.youtube && (
<Link
href={siteConfig.links.youtube}
target="_blank"
rel="noreferrer"
aria-label="YouTube"
className="inline-flex h-8 w-8 items-center justify-center rounded-md hover:bg-accent hover:text-accent-foreground"
>
<Icons.youtube className="size-4" aria-hidden="true" />
</Link>
)}
{siteConfig.mail && (
<Link
href={`mailto:${siteConfig.mail}`}
target="_blank"
rel="noreferrer"
aria-label="Email"
className="inline-flex h-8 w-8 items-center justify-center rounded-md hover:bg-accent hover:text-accent-foreground"
>
<Icons.email className="size-4" aria-hidden="true" />
</Link>
)}
</div>
<BuiltWithButton />
</div>
</div>
@ -133,14 +64,81 @@ export function Footer({ className }: React.HTMLAttributes<HTMLElement>) {
</div>
</Container>
<div className="border-t py-4">
<div className="border-t py-8">
<Container className="px-4 flex items-center justify-between">
<span className="text-muted-foreground text-sm">
Copyright &copy; {new Date().getFullYear()} All Rights Reserved.
&copy; {new Date().getFullYear()} All Rights Reserved.
</span>
<div className="flex items-center gap-3">
<ModeToggle />
<div className="flex items-center gap-2">
{siteConfig.links.github && (
<Link
href={siteConfig.links.github}
target="_blank"
rel="noreferrer"
aria-label="GitHub"
className="inline-flex h-8 w-8 items-center justify-center rounded-md hover:bg-accent hover:text-accent-foreground"
>
<Icons.github className="size-4" aria-hidden="true" />
</Link>
)}
{siteConfig.links.twitter && (
<Link
href={siteConfig.links.twitter}
target="_blank"
rel="noreferrer"
aria-label="Twitter"
className="inline-flex h-8 w-8 items-center justify-center rounded-md hover:bg-accent hover:text-accent-foreground"
>
<Icons.twitter className="size-4" aria-hidden="true" />
</Link>
)}
{siteConfig.links.twitter_cn && (
<Link
href={siteConfig.links.twitter_cn}
target="_blank"
rel="noreferrer"
aria-label="Twitter(CN)"
className="inline-flex h-8 w-8 items-center justify-center rounded-md hover:bg-accent hover:text-accent-foreground"
>
<Icons.twitter className="size-4" aria-hidden="true" />
</Link>
)}
{siteConfig.links.bluesky && (
<Link
href={siteConfig.links.bluesky}
target="_blank"
rel="noreferrer"
aria-label="Bluesky"
className="inline-flex h-8 w-8 items-center justify-center rounded-md hover:bg-accent hover:text-accent-foreground"
>
<Icons.bluesky className="size-4" aria-hidden="true" />
</Link>
)}
{siteConfig.links.youtube && (
<Link
href={siteConfig.links.youtube}
target="_blank"
rel="noreferrer"
aria-label="YouTube"
className="inline-flex h-8 w-8 items-center justify-center rounded-md hover:bg-accent hover:text-accent-foreground"
>
<Icons.youtube className="size-4" aria-hidden="true" />
</Link>
)}
{siteConfig.mail && (
<Link
href={`mailto:${siteConfig.mail}`}
target="_blank"
rel="noreferrer"
aria-label="Email"
className="inline-flex h-8 w-8 items-center justify-center rounded-md hover:bg-accent hover:text-accent-foreground"
>
<Icons.email className="size-4" aria-hidden="true" />
</Link>
)}
</div>
</div>
</Container>
</div>

5
src/components/layout/navbar.tsx
View File

@ -13,7 +13,7 @@ import {
NavigationMenuList,
navigationMenuTriggerStyle,
} from "@/components/ui/navigation-menu";
import { Sheet, SheetContent, SheetTrigger } from "@/components/ui/sheet";
import { Sheet, SheetContent, SheetTitle, SheetHeader, SheetTrigger } from "@/components/ui/sheet";
import { siteConfig } from "@/config/site";
import { useScroll } from "@/hooks/use-scroll";
import { cn } from "@/lib/utils";
@ -149,6 +149,9 @@ export function Navbar({ scroll = false, config }: NavBarProps) {
</Button>
</SheetTrigger>
<SheetContent side="left" className="flex flex-col p-0">
<SheetHeader>
<SheetTitle />
</SheetHeader>
<div className="flex h-screen flex-col">
{/* logo */}
<a href="/"

21
src/config/footer.ts
View File

@ -1,5 +1,4 @@
import type { FooterConfig } from "@/types";
import { siteConfig } from "./site";
export const footerConfig: FooterConfig = {
links: [
@ -12,26 +11,26 @@ export const footerConfig: FooterConfig = {
],
},
{
title: "Resources",
title: "Solution",
items: [
{ title: "Showcase", href: "/showcase" },
{ title: "Blog", href: "/blog" },
{ title: "Documentation", href: "/docs", },
],
},
{
title: "Support",
items: [
...(siteConfig.links.twitter ? [{ title: "Twitter", href: siteConfig.links.twitter, external: true }] : []),
...(siteConfig.links.bluesky ? [{ title: "Bluesky", href: siteConfig.links.bluesky, external: true }] : []),
...(siteConfig.links.youtube ? [{ title: "Youtube", href: siteConfig.links.youtube, external: true }] : []),
{ title: "Changelog", href: "/changelog" },
],
},
{
title: "Company",
items: [
{ title: "About Us", href: "/about" },
{ title: "Contact Us", href: "/contact" },
{ title: "Careers", href: "/careers" },
],
},
{
title: "Legal",
items: [
{ title: "Privacy Policy", href: "/privacy" },
{ title: "Cookie Policy", href: "/cookie" },
{ title: "Terms of Service", href: "/terms" },
],
},

8
src/config/marketing.ts
View File

@ -18,9 +18,9 @@ export const marketingConfig: MarketingConfig = {
icon: "blog",
},
{
title: "Dashboard",
href: "/dashboard",
icon: "dashboard",
},
title: "About",
href: "/about",
icon: "about",
},
],
};