diff --git a/src/components/Footer/Footer.module.css b/src/components/Footer/Footer.module.css index a8254af..5facaae 100644 --- a/src/components/Footer/Footer.module.css +++ b/src/components/Footer/Footer.module.css @@ -14,6 +14,18 @@ margin: 0 0 30px; } +.imprint { + opacity: 0.7; + display: block; + font-size: 12px; + text-decoration: underline; + text-align: center; + + &:hover { + opacity: 1; + } +} + @media (min-width: 768px) { .branding { display: flex; @@ -28,6 +40,10 @@ .description { margin: 0 50px 0; } + + .imprint { + text-align: right; + } } @media (min-width: 768px) and (max-width: 1023px) { diff --git a/src/components/Footer/Footer.tsx b/src/components/Footer/Footer.tsx index efb6b17..156cdc3 100644 --- a/src/components/Footer/Footer.tsx +++ b/src/components/Footer/Footer.tsx @@ -2,7 +2,7 @@ import logo from "../../../public/logo.svg"; import styles from "./Footer.module.css"; import { SocialLinks } from "@/components/SocialLinks/SocialLinks"; -import { getAppName, getLabel } from "@/lib/data"; +import { getAppName, getImprintUrl, getLabel } from "@/lib/data"; export function Footer() { return ( @@ -12,6 +12,9 @@ export function Footer() {

{getLabel("footer")}

+ + {getLabel("imprint")} + ); } diff --git a/src/lib/data.ts b/src/lib/data.ts index 971bf52..57c9aee 100644 --- a/src/lib/data.ts +++ b/src/lib/data.ts @@ -62,6 +62,10 @@ export function getItems(quadrant?: string, featured?: boolean): Item[] { }) as Item[]; } +export function getImprintUrl() { + return config.imprint; +} + export function getItem(id: string): Item | undefined { return data.items.find((item) => item.id === id) as Item; }