Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 | 5x 80x 80x 80x | /**
* PublicFooter Component
* Footer for public website with contact info, links, and copyright
*/
import { Link } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
export const PublicFooter = () => {
const { t } = useTranslation('common');
const currentYear = new Date().getFullYear();
return (
<footer className="border-t border-zinc-800 bg-zinc-900">
<div className="container mx-auto px-4 py-8">
<div className="grid grid-cols-1 gap-8 md:grid-cols-3">
{/* Branding */}
<div>
<h3 className="text-lg font-light">{t('app.name')}</h3>
<p className="mt-2 text-sm text-zinc-400">{t('footer.tagline')}</p>
<p className="mt-4 text-sm text-zinc-400">
<a href="mailto:info@batbern.ch" className="hover:text-blue-400 transition-colors">
info@batbern.ch
</a>
</p>
</div>
{/* Links */}
<div>
<h4 className="text-sm font-medium text-zinc-300">{t('footer.quickLinks')}</h4>
<ul className="mt-2 space-y-2">
<li>
<Link
to="/"
className="text-sm text-zinc-400 hover:text-blue-400 transition-colors"
>
{t('footer.currentEvent')}
</Link>
</li>
<li>
<Link
to="/archive"
className="text-sm text-zinc-400 hover:text-blue-400 transition-colors"
>
{t('navigation.pastEvents')}
</Link>
</li>
<li>
<Link
to="/about"
className="text-sm text-zinc-400 hover:text-blue-400 transition-colors"
>
{t('navigation.about')}
</Link>
</li>
</ul>
</div>
{/* Legal */}
<div>
<h4 className="text-sm font-medium text-zinc-300">{t('footer.legal')}</h4>
<ul className="mt-2 space-y-2">
<li>
<Link
to="/privacy"
className="text-sm text-zinc-400 hover:text-blue-400 transition-colors"
>
{t('footer.privacyPolicy')}
</Link>
</li>
<li>
<Link
to="/support"
className="text-sm text-zinc-400 hover:text-blue-400 transition-colors"
>
{t('footer.support')}
</Link>
</li>
</ul>
<p className="mt-4 text-sm text-zinc-400">
{t('footer.copyright', { year: currentYear })}
</p>
</div>
</div>
</div>
</footer>
);
};
|