Skip to content

Commit bb6ffb1

Browse files
emilyjablonskiemilyjablonski
authored
feat: jurisdictionalized public footer (#5929)
1 parent ddab272 commit bb6ffb1

File tree

4 files changed

+123
-38
lines changed

4 files changed

+123
-38
lines changed

‎sites/public/src/components/shared/CustomSiteFooter.module.scss‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,9 @@
2727
flex-direction: column;
2828
align-items: flex-start;
2929
margin: auto;
30+
a {
31+
text-decoration: none;
32+
}
3033
}
3134

3235
.icon-container {
@@ -74,9 +77,10 @@
7477
}
7578

7679
.text-container {
77-
display: flex;
78-
flex-direction: column;
7980
margin-block-end: var(--seeds-s4);
81+
a {
82+
text-decoration: underline;
83+
}
8084
}
8185

8286
.text-container:last-of-type {

‎sites/public/src/components/shared/CustomSiteFooter.tsx‎

Lines changed: 57 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,49 +1,70 @@
11
import React from "react"
2-
import Link from "next/link"
3-
import { t } from "@bloom-housing/ui-components"
2+
import { Link } from "@bloom-housing/ui-seeds"
43
import MaxWidthLayout from "../../layouts/max-width"
4+
import {
5+
FooterContent,
6+
FooterLinks,
7+
getGenericFooterLinksContent,
8+
getGenericFooterTextContent,
9+
} from "../../static_content/generic_footer_content"
10+
import {
11+
getJurisdictionFooterLinksContent,
12+
getJurisdictionFooterTextContent,
13+
} from "../../static_content/jurisdiction_footer_content"
514
import styles from "./CustomSiteFooter.module.scss"
615

716
const CustomSiteFooter = () => {
17+
const textContent: FooterContent | null =
18+
getJurisdictionFooterTextContent() || getGenericFooterTextContent()
19+
const footerLinksContent: FooterLinks | null =
20+
getJurisdictionFooterLinksContent() || getGenericFooterLinksContent()
21+
22+
const showContentFooter = textContent.logo || textContent.textSections?.length > 0
23+
const showLinksFooter = footerLinksContent.links?.length > 0 || footerLinksContent.cityString
24+
25+
if (!showContentFooter && !showLinksFooter) return <></>
26+
827
return (
928
<footer>
10-
<MaxWidthLayout className={styles["footer-container"]}>
11-
<div className={styles["footer-content-container"]}>
12-
<div className={styles["footer"]}>
13-
<div className={styles["icon-container"]}>
14-
<a href={"/"} className={styles["jurisdiction-icon"]}>
15-
<img src="/images/default-housing-logo.svg" alt={"Jurisdiction Logo"} />
16-
</a>
17-
</div>
18-
<div className={styles["text-container"]}>
19-
<span>{t("footer.content.projectOf")}</span>
20-
<Link href={"/"}>Mayor's Office of Housing Development</Link>
21-
</div>
22-
<div className={styles["text-container"]}>
23-
<span>{t("footer.content.partnership")}</span>
24-
<Link href={"/"}>Bloomington Department of Technology</Link>
25-
<Link href={"/"}>Mayor's Office of Civic Innovation</Link>
26-
</div>
27-
<div className={styles["text-container"]}>
28-
<p>{t("footer.content.applicationQuestions")}</p>
29-
<p>{t("footer.content.programQuestions")}</p>
29+
{showContentFooter && (
30+
<MaxWidthLayout className={styles["footer-container"]}>
31+
<div className={styles["footer-content-container"]}>
32+
<div className={styles["footer"]}>
33+
{textContent.logo && (
34+
<div className={styles["icon-container"]}>
35+
<a href={textContent.logo.logoUrl || "/"} className={styles["jurisdiction-icon"]}>
36+
<img
37+
src={textContent.logo.logoSrc}
38+
alt={textContent.logo.logoAltText || "Jurisdiction Logo"}
39+
/>
40+
</a>
41+
</div>
42+
)}
43+
{textContent.textSections.map((section, index) => (
44+
<div key={index} className={styles["text-container"]}>
45+
{section}
46+
</div>
47+
))}
3048
</div>
3149
</div>
32-
</div>
33-
</MaxWidthLayout>
34-
<MaxWidthLayout
35-
className={`${styles["footer-content-container"]} ${styles["copyright-content-container"]}`}
36-
>
37-
<div className={`${styles["footer"]} ${styles["copyright"]}`}>
38-
<div className={styles["copyright-text"]}>{t("footer.copyright")}</div>
39-
<div className={styles.links}>
40-
<Link href="/">{t("footer.giveFeedback")}</Link>
41-
<Link href="/">{t("footer.contact")}</Link>
42-
<Link href="/privacy">{t("pageTitle.privacy")}</Link>
43-
<Link href="/disclaimer">{t("pageTitle.disclaimer")}</Link>
50+
</MaxWidthLayout>
51+
)}
52+
{showLinksFooter && (
53+
<MaxWidthLayout
54+
className={`${styles["footer-content-container"]} ${styles["copyright-content-container"]}`}
55+
>
56+
<div className={`${styles["footer"]} ${styles["copyright"]}`}>
57+
<div className={styles["copyright-text"]}>{footerLinksContent.cityString || ""}</div>
58+
<div className={styles.links}>
59+
{footerLinksContent.links?.map((link, index) => (
60+
<Link key={index} href={link.href}>
61+
{link.text}
62+
</Link>
63+
))}
64+
</div>
4465
</div>
45-
</div>
46-
</MaxWidthLayout>
66+
</MaxWidthLayout>
67+
)}
4768
</footer>
4869
)
4970
}

‎sites/public/src/static_content/generic_footer_content.tsx‎

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
import { Link } from "@bloom-housing/ui-seeds"
2+
import { t } from "@bloom-housing/ui-components"
3+
4+
export type FooterContent = {
5+
textSections: React.ReactNode[]
6+
logo?: {
7+
logoSrc: string
8+
logoAltText?: string
9+
logoUrl?: string
10+
}
11+
}
12+
13+
export type FooterLinks = {
14+
links: {
15+
text: string
16+
href: string
17+
}[]
18+
cityString?: string
19+
}
20+
21+
export const getGenericFooterTextContent = (): FooterContent => {
22+
return {
23+
textSections: [
24+
<>
25+
<span>{t("footer.content.projectOf")}</span>{" "}
26+
<Link href={"/"}>Mayor's Office of Housing Development</Link>{" "}
27+
</>,
28+
<>
29+
<p>{t("footer.content.applicationQuestions")}</p>
30+
<p>{t("footer.content.programQuestions")}</p>
31+
</>,
32+
],
33+
logo: {
34+
logoSrc: "/images/default-housing-logo.svg",
35+
logoAltText: "Jurisdiction Logo",
36+
logoUrl: "/",
37+
},
38+
}
39+
}
40+
41+
export const getGenericFooterLinksContent = (): FooterLinks => {
42+
return {
43+
links: [
44+
{ text: t("footer.giveFeedback"), href: "/" },
45+
{ text: t("footer.contact"), href: "/" },
46+
{ text: t("pageTitle.privacy"), href: "/privacy" },
47+
{ text: t("pageTitle.disclaimer"), href: "/disclaimer" },
48+
],
49+
cityString: t("footer.copyright"),
50+
}
51+
}

‎sites/public/src/static_content/jurisdiction_footer_content.tsx‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import { FooterContent, FooterLinks } from "./generic_footer_content"
2+
3+
export const getJurisdictionFooterTextContent = (): FooterContent => {
4+
return null
5+
}
6+
7+
export const getJurisdictionFooterLinksContent = (): FooterLinks => {
8+
return null
9+
}

0 commit comments

Comments
 (0)