footer configuration
All checks were successful
Deploy / deploy (ubuntu-latest, 2.44.0) (push) Successful in 1m29s

Took 8 minutes
This commit is contained in:
Braydon 2024-10-09 17:38:36 -04:00
parent 3d44677d82
commit cf8530c750
3 changed files with 90 additions and 46 deletions

View File

@ -45,5 +45,44 @@
"href": "mailto:support@pulseapp.cc",
"navbar": false
}
]
],
"footer": {
"homeUrl": "https://pulseapp.cc",
"links": {
"Resources": [
{
"name": "Support",
"href": "https://support.pulseapp.cc"
},
{
"name": "Jobs",
"href": "https://jobs.pulseapp.cc"
},
{
"name": "Developers",
"shortName": "Devs",
"href": "https://dev.pulseapp.cc",
"external": true
},
{
"name": "System Status",
"shortName": "Status",
"href": "https://status.pulseapp.cc",
"external": true
}
],
"Legal": [
{
"name": "Terms & Conditions",
"shortName": "Terms",
"href": "/legal/terms"
},
{
"name": "Privacy Policy",
"shortName": "Privacy",
"href": "/legal/privacy"
}
]
}
}
}

View File

@ -27,6 +27,23 @@ export type Config = {
* Social links for this app.
*/
socialLinks: SocialLinkType[];
/**
* Configuration for the footer.
*/
footer: {
/**
* The URL to link to when the branding is clicked.
*/
homeUrl: string;
/**
* Links for the footer.
*/
links: {
[category: string]: FooterLink[];
};
};
};
export type SocialLinkType = {
@ -57,3 +74,26 @@ export type SocialLinkType = {
*/
navbar: boolean;
};
export type FooterLink = {
/**
* The name of this link.
*/
name: string;
/**
* The href for this link.
*/
href: string;
/**
* The optional name to show
* when the screen size is small.
*/
shortName?: string;
/**
* Is this an external link?
*/
external?: boolean;
};

View File

@ -10,43 +10,6 @@ import SocialLink from "@/components/social-link";
import config from "@/config";
import { SocialLinkType } from "@/types/config";
const links = {
Resources: [
{
name: "Support",
href: "https://support.pulseapp.cc",
},
{
name: "Jobs",
href: "https://jobs.pulseapp.cc",
},
{
name: "Developers",
shortName: "Devs",
href: "https://dev.pulseapp.cc",
external: true,
},
{
name: "System Status",
shortName: "Status",
href: "https://status.pulseapp.cc",
external: true,
},
],
Legal: [
{
name: "Terms & Conditions",
shortName: "Terms",
href: "/legal/terms",
},
{
name: "Privacy Policy",
shortName: "Privacy",
href: "/legal/privacy",
},
],
};
const Footer = (): ReactElement => (
<footer className="relative mt-3 h-[19.5rem] md:h-[17rem] flex justify-center border-t border-zinc-700/75 overflow-hidden select-none">
<div className="w-full md:max-w-[65rem]">
@ -69,13 +32,15 @@ const Footer = (): ReactElement => (
{/* Links */}
<div className="flex gap-7 md:gap-12 transition-all transform-gpu">
{Object.entries(links).map(([title, links]) => (
<LinkCategory key={title} title={title}>
{links.map((link) => (
<FooterLink key={link.name} {...link} />
))}
</LinkCategory>
))}
{Object.entries(config.footer.links).map(
([title, links]) => (
<LinkCategory key={title} title={title}>
{links.map((link) => (
<FooterLink key={link.name} {...link} />
))}
</LinkCategory>
)
)}
</div>
</div>
@ -100,7 +65,7 @@ const Footer = (): ReactElement => (
const Branding = () => (
<Link
className="flex gap-3 items-center hover:opacity-75 transition-all transform-gpu"
href="https://pulseapp.cc"
href={config.footer.homeUrl}
draggable={false}
>
<Image