feat: Add footer with legal links (Impressum, Datenschutz, Einstellungen)

This commit is contained in:
2025-12-26 22:02:00 +01:00
parent f1990ebf2d
commit e6278e5ec6
2 changed files with 34 additions and 23 deletions

View File

@@ -19,34 +19,34 @@ export const metadata: Metadata = {
// ========================================== // ==========================================
const IMPRESSUM_DATA = { const IMPRESSUM_DATA = {
// Verantwortlicher // Verantwortlicher
name: 'Max Mustermann', // TODO: Dein Name name: 'Robin Schmidt', // TODO: Dein Name
// Adresse // Adresse
street: 'Musterstraße 123', // TODO: Straße + Hausnummer street: 'Bergstraße 43', // TODO: Straße + Hausnummer
city: '12345 Musterstadt', // TODO: PLZ + Stadt city: '67067 Ludwigshafen', // TODO: PLZ + Stadt
country: 'Deutschland', country: 'Deutschland',
// Kontakt (wird bot-sicher dargestellt) // Kontakt (wird bot-sicher dargestellt)
email: { email: {
user: 'kontakt', // TODO: Teil vor dem @ user: 'iamrobinschmidt', // TODO: Teil vor dem @
domain: 'example.com', // TODO: Teil nach dem @ domain: 'icloud.com', // TODO: Teil nach dem @
}, },
phone: { phone: {
prefix: '+49', // TODO: Ländervorwahl prefix: '+49', // TODO: Ländervorwahl
area: '123', // TODO: Vorwahl area: '123', // TODO: Vorwahl
number: '4567890', // TODO: Rufnummer number: '4567890', // TODO: Rufnummer
}, },
// Optional: Firma // Optional: Firma
company: '', // TODO: Firmenname (leer lassen wenn Privatperson) company: '', // TODO: Firmenname (leer lassen wenn Privatperson)
// Optional: Handelsregister // Optional: Handelsregister
registry: '', // z.B. 'HRB 12345' registry: '', // z.B. 'HRB 12345'
registryCourt: '', // z.B. 'Amtsgericht München' registryCourt: '', // z.B. 'Amtsgericht München'
// Optional: USt-IdNr. // Optional: USt-IdNr.
vatId: '', // z.B. 'DE123456789' vatId: '', // z.B. 'DE123456789'
// Optional: Berufsbezeichnung / Aufsichtsbehörde (für bestimmte Berufe) // Optional: Berufsbezeichnung / Aufsichtsbehörde (für bestimmte Berufe)
profession: '', profession: '',
supervisoryAuthority: '', supervisoryAuthority: '',
@@ -59,7 +59,7 @@ const IMPRESSUM_DATA = {
*/ */
function BotProofEmail({ user, domain }: { user: string; domain: string }) { function BotProofEmail({ user, domain }: { user: string; domain: string }) {
return ( return (
<span <span
className="inline-flex items-center gap-1.5 text-orange-500 cursor-pointer hover:underline" className="inline-flex items-center gap-1.5 text-orange-500 cursor-pointer hover:underline"
onClick={() => { onClick={() => {
window.location.href = `mailto:${user}@${domain}`; window.location.href = `mailto:${user}@${domain}`;
@@ -81,7 +81,7 @@ function BotProofEmail({ user, domain }: { user: string; domain: string }) {
function BotProofPhone({ prefix, area, number }: { prefix: string; area: string; number: string }) { function BotProofPhone({ prefix, area, number }: { prefix: string; area: string; number: string }) {
const fullNumber = `${prefix}${area}${number}`; const fullNumber = `${prefix}${area}${number}`;
return ( return (
<span <span
className="inline-flex items-center gap-1.5 text-orange-500 cursor-pointer hover:underline" className="inline-flex items-center gap-1.5 text-orange-500 cursor-pointer hover:underline"
onClick={() => { onClick={() => {
window.location.href = `tel:${fullNumber}`; window.location.href = `tel:${fullNumber}`;
@@ -126,7 +126,7 @@ export default function ImpressumPage() {
<User size={14} /> <User size={14} />
Angaben gemäß § 5 TMG Angaben gemäß § 5 TMG
</h2> </h2>
<div className="space-y-3"> <div className="space-y-3">
{data.company && ( {data.company && (
<div className="flex items-center gap-2 text-white"> <div className="flex items-center gap-2 text-white">
@@ -134,11 +134,11 @@ export default function ImpressumPage() {
<span className="font-bold">{data.company}</span> <span className="font-bold">{data.company}</span>
</div> </div>
)} )}
<div className="text-white font-bold"> <div className="text-white font-bold">
{data.name} {data.name}
</div> </div>
<div className="flex items-start gap-2 text-zinc-400"> <div className="flex items-start gap-2 text-zinc-400">
<MapPin size={16} className="text-zinc-500 mt-0.5" /> <MapPin size={16} className="text-zinc-500 mt-0.5" />
<div> <div>
@@ -155,17 +155,17 @@ export default function ImpressumPage() {
<h2 className="text-sm font-bold uppercase tracking-widest text-zinc-500 mb-4"> <h2 className="text-sm font-bold uppercase tracking-widest text-zinc-500 mb-4">
Kontakt Kontakt
</h2> </h2>
<div className="space-y-3"> <div className="space-y-3">
<div> <div>
<BotProofEmail user={data.email.user} domain={data.email.domain} /> <BotProofEmail user={data.email.user} domain={data.email.domain} />
</div> </div>
{data.phone.number && ( {data.phone.number && (
<div> <div>
<BotProofPhone <BotProofPhone
prefix={data.phone.prefix} prefix={data.phone.prefix}
area={data.phone.area} area={data.phone.area}
number={data.phone.number} number={data.phone.number}
/> />
</div> </div>
)} )}
@@ -178,7 +178,7 @@ export default function ImpressumPage() {
<h2 className="text-sm font-bold uppercase tracking-widest text-zinc-500 mb-4"> <h2 className="text-sm font-bold uppercase tracking-widest text-zinc-500 mb-4">
Registereintrag Registereintrag
</h2> </h2>
<div className="space-y-2 text-zinc-400 text-sm"> <div className="space-y-2 text-zinc-400 text-sm">
{data.registry && ( {data.registry && (
<div> <div>
@@ -203,7 +203,7 @@ export default function ImpressumPage() {
<h2 className="text-sm font-bold uppercase tracking-widest text-zinc-500 mb-4"> <h2 className="text-sm font-bold uppercase tracking-widest text-zinc-500 mb-4">
Berufsrechtliche Angaben Berufsrechtliche Angaben
</h2> </h2>
<div className="space-y-2 text-zinc-400 text-sm"> <div className="space-y-2 text-zinc-400 text-sm">
{data.profession && ( {data.profession && (
<div> <div>

View File

@@ -280,6 +280,17 @@ export default function Home() {
</div> </div>
</div> </div>
{/* Footer */}
<footer className="pb-28 pt-8 text-center">
<div className="flex justify-center gap-4 text-xs text-zinc-600">
<a href="/impressum" className="hover:text-orange-500 transition-colors">Impressum</a>
<span></span>
<a href="/privacy" className="hover:text-orange-500 transition-colors">Datenschutz</a>
<span></span>
<a href="/settings" className="hover:text-orange-500 transition-colors">Einstellungen</a>
</div>
</footer>
<BottomNavigation <BottomNavigation
onScan={handleImageSelected} onScan={handleImageSelected}
onHome={() => window.scrollTo({ top: 0, behavior: 'smooth' })} onHome={() => window.scrollTo({ top: 0, behavior: 'smooth' })}