Website: Refactor Footer for improved layout and styling consistency

This commit is contained in:
Bram Suurd 2025-02-06 18:26:09 +01:00
parent d7b6a97415
commit de01aa7e0e
No known key found for this signature in database
GPG Key ID: D93B668D7609ECD4

View File

@ -1,34 +1,38 @@
import { basePath } from "@/config/siteConfig"; import { basePath } from "@/config/siteConfig";
import Link from "next/link"; import Link from "next/link";
import { FileJson, Server, ExternalLink } from "lucide-react"; import { FileJson, Server, ExternalLink } from "lucide-react";
import { buttonVariants } from "./ui/button";
import { cn } from "@/lib/utils";
export default function Footer() { export default function Footer() {
return ( return (
<div className="supports-backdrop-blur:bg-background/90 mt-auto flex border-t border-border bg-background/40 py-6 backdrop-blur-lg"> <div className="supports-backdrop-blur:bg-background/90 mt-auto border-t w-full flex justify-between border-border bg-background/40 py-6 backdrop-blur-lg">
<div className="mx-6 w-full max-w-7xl flex justify-between text-xs sm:text-sm text-muted-foreground"> <div className="mx-6 w-full flex justify-between text-xs sm:text-sm text-muted-foreground">
<div> <div className="flex items-center">
Website built by the community. The source code is available on{" "} <p>
<Link Website built by the community. The source code is available on{" "}
href={`https://github.com/community-scripts/${basePath}`} <Link
target="_blank" href={`https://github.com/community-scripts/${basePath}`}
rel="noreferrer" target="_blank"
className="font-semibold underline-offset-2 duration-300 hover:underline" rel="noreferrer"
data-umami-event="View Website Source Code on Github" className="font-semibold underline-offset-2 duration-300 hover:underline"
> data-umami-event="View Website Source Code on Github"
GitHub >
</Link> GitHub
. </Link>
.
</p>
</div> </div>
<div className="flex gap-4"> <div className="sm:flex hidden">
<Link <Link
href="/json-editor" href="/json-editor"
className="flex items-center gap-2 text-primary hover:underline" className={cn(buttonVariants({ variant: "link" }), "text-muted-foreground flex items-center gap-2")}
> >
<FileJson className="h-4 w-4" /> JSON Editor <FileJson className="h-4 w-4" /> JSON Editor
</Link> </Link>
<Link <Link
href="/data" href="/data"
className="flex items-center gap-2 text-primary hover:underline" className={cn(buttonVariants({ variant: "link" }), "text-muted-foreground flex items-center gap-2")}
> >
<Server className="h-4 w-4" /> API Data <Server className="h-4 w-4" /> API Data
</Link> </Link>