mmintel/e-tib.com
1
0
Fork 0
Code Issues Pull Requests 2 Actions 150 Packages Projects Releases Wiki Activity

feat: add initial cinematic loader and global shutter page transitions

Browse Source 
Former-commit-id: 641bf3103e29559d7bdff1dc1e034b21a11dbad6
This commit is contained in:
Marc Mintel
2026-05-07 19:25:10 +02:00
parent cbc90aa872
commit b515e45c0d
9 changed files with 314 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
components/layout/Footer.tsx
View File

@@ -1,4 +1,4 @@
import Link from 'next/link';
import { TransitionLink } from '@/components/ui/TransitionLink';
import Image from 'next/image';
import { useLocale } from 'next-intl';
import { ShieldCheck, Leaf, Lock, Accessibility, Zap } from 'lucide-react';
@@ -24,14 +24,14 @@ export function Footer({ companyInfo }: FooterProps) {
<div className="container grid grid-cols-1 md:grid-cols-4 lg:grid-cols-12 gap-12 lg:gap-8 mb-12">
{/* Brand Column */}
<div className="col-span-1 md:col-span-2 lg:col-span-4 space-y-6">
<Link href={`/${locale}`} className="relative block h-14 w-48 mb-6 group">
<TransitionLink href={`/${locale}`} className="relative block h-14 w-48 mb-6 group">
<Image
src="/assets/logo-white.png"
alt="E-TIB Gruppe"
fill
className="object-contain object-left transition-transform duration-500 group-hover:scale-105"
/>
</Link>
</TransitionLink>
<p className="text-white/60 text-base leading-relaxed max-w-sm">
{locale === 'de'
? 'Die Experten für Kabeltiefbau, Horizontalspülbohrungen und umfassende Infrastrukturprojekte. Qualität und Zuverlässigkeit aus Guben.'
@@ -53,29 +53,29 @@ export function Footer({ companyInfo }: FooterProps) {
</h4>
<ul className="space-y-4">
<li>
<Link href={`/${locale}/kompetenzen`} className="text-white/70 hover:text-white hover:translate-x-1 inline-block transition-all">
<TransitionLink href={`/${locale}/kompetenzen`} className="text-white/70 hover:text-white hover:translate-x-1 inline-block transition-all">
{locale === 'de' ? 'Kompetenzen' : 'Competencies'}
</Link>
</TransitionLink>
</li>
<li>
<Link href={`/${locale}/ueber-uns`} className="text-white/70 hover:text-white hover:translate-x-1 inline-block transition-all">
<TransitionLink href={`/${locale}/ueber-uns`} className="text-white/70 hover:text-white hover:translate-x-1 inline-block transition-all">
{locale === 'de' ? 'Über uns' : 'About us'}
</Link>
</TransitionLink>
</li>
<li>
<Link href={`/${locale}/karriere`} className="text-white/70 hover:text-white hover:translate-x-1 inline-block transition-all">
<TransitionLink href={`/${locale}/karriere`} className="text-white/70 hover:text-white hover:translate-x-1 inline-block transition-all">
{locale === 'de' ? 'Karriere' : 'Career'}
</Link>
</TransitionLink>
</li>
<li>
<Link href={`/${locale}/messen`} className="text-white/70 hover:text-white hover:translate-x-1 inline-block transition-all">
<TransitionLink href={`/${locale}/messen`} className="text-white/70 hover:text-white hover:translate-x-1 inline-block transition-all">
{locale === 'de' ? 'Messen & Events' : 'Fairs & Events'}
</Link>
</TransitionLink>
</li>
<li>
<Link href={`/${locale}/${locale === 'de' ? 'kontakt' : 'contact'}`} className="text-white/70 hover:text-white hover:translate-x-1 inline-block transition-all">
<TransitionLink href={`/${locale}/${locale === 'de' ? 'kontakt' : 'contact'}`} className="text-white/70 hover:text-white hover:translate-x-1 inline-block transition-all">
{locale === 'de' ? 'Kontakt' : 'Contact'}
</Link>
</TransitionLink>
</li>
</ul>
</div>
@@ -87,19 +87,19 @@ export function Footer({ companyInfo }: FooterProps) {
</h4>
<ul className="space-y-4">
<li>
<Link href={`/${locale}/impressum`} className="text-white/70 hover:text-white hover:translate-x-1 inline-block transition-all">
<TransitionLink href={`/${locale}/impressum`} className="text-white/70 hover:text-white hover:translate-x-1 inline-block transition-all">
{locale === 'de' ? 'Impressum' : 'Imprint'}
</Link>
</TransitionLink>
</li>
<li>
<Link href={`/${locale}/datenschutz`} className="text-white/70 hover:text-white hover:translate-x-1 inline-block transition-all">
<TransitionLink href={`/${locale}/datenschutz`} className="text-white/70 hover:text-white hover:translate-x-1 inline-block transition-all">
{locale === 'de' ? 'Datenschutz' : 'Privacy Policy'}
</Link>
</TransitionLink>
</li>
<li>
<Link href={`/${locale}/${locale === 'de' ? 'agb' : 'terms'}`} className="text-white/70 hover:text-white hover:translate-x-1 inline-block transition-all">
<TransitionLink href={`/${locale}/${locale === 'de' ? 'agb' : 'terms'}`} className="text-white/70 hover:text-white hover:translate-x-1 inline-block transition-all">
{locale === 'de' ? 'AGB' : 'Terms'}
</Link>
</TransitionLink>
</li>
</ul>
</div>