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

feat: upgrade UI with premium industrial aesthetics, purely visual language switch, and resilient error pages

Browse Source 
Former-commit-id: e4d801c24e64c41816f86de9767b47894abb6806
This commit is contained in:
Marc Mintel
2026-05-09 09:39:58 +02:00
parent 3590d47fdb
commit 2ce9ac11e7
15 changed files with 453 additions and 232 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
components/layout/LanguageSwitcher.tsx
View File

@@ -26,27 +26,31 @@ export function LanguageSwitcher({ mobile = false, isSolidMode = false }: Langua
if (mobile) {
return (
<div className="flex flex-col gap-3">
{locales.map((loc) => (
<TransitionLink
key={loc.code}
href={getSwitchedUrl(loc.code)}
className={`group relative overflow-hidden flex items-center gap-3 px-5 py-3 rounded-xl text-lg font-semibold transition-all duration-300 ${
currentLocale === loc.code
? 'bg-primary/10 text-primary border border-primary/20'
: 'text-text-secondary hover:bg-neutral-50 border border-transparent'
}`}
>
<HoverShineOverlay shineColor="via-primary/5" />
<span className="relative z-10 text-2xl" aria-hidden="true">{loc.flag}</span>
<span className="relative z-10">{loc.fullLabel}</span>
{currentLocale === loc.code && (
<svg className="relative z-10 w-5 h-5 ml-auto text-primary" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="3" strokeLinecap="round" strokeLinejoin="round">
<polyline points="20 6 9 17 4 12" />
</svg>
)}
</TransitionLink>
))}
{locales.map((loc) => {
const currentLocObj = locales.find(l => l.code === currentLocale) || locales[0];
return (
<TransitionLink
key={loc.code}
href={getSwitchedUrl(loc.code)}
transitionMessage={currentLocale === loc.code ? undefined : `LANG_SWITCH:${currentLocObj.flag}:${loc.flag}`}
className={`group relative overflow-hidden flex items-center gap-3 px-5 py-3 rounded-xl text-lg font-semibold transition-all duration-300 ${
currentLocale === loc.code
? 'bg-primary/10 text-primary border border-primary/20'
: 'text-text-secondary hover:bg-neutral-50 border border-transparent'
}`}
>
<HoverShineOverlay shineColor="via-primary/5" />
<span className="relative z-10 text-2xl" aria-hidden="true">{loc.flag}</span>
<span className="relative z-10">{loc.fullLabel}</span>
{currentLocale === loc.code && (
<svg className="relative z-10 w-5 h-5 ml-auto text-primary" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="3" strokeLinecap="round" strokeLinejoin="round">
<polyline points="20 6 9 17 4 12" />
</svg>
)}
</TransitionLink>
);
})}
</div>
);
}
@@ -72,10 +76,13 @@ export function LanguageSwitcher({ mobile = false, isSolidMode = false }: Langua
: 'text-white/70 hover:text-white';
}
const currentLocObj = locales.find(l => l.code === currentLocale) || locales[0];
return (
<TransitionLink
key={loc.code}
href={getSwitchedUrl(loc.code)}
transitionMessage={isActive ? undefined : `LANG_SWITCH:${currentLocObj.flag}:${loc.flag}`}
className={`relative z-10 flex items-center gap-1.5 px-3 py-1.5 rounded-full text-xs font-bold uppercase tracking-wider transition-all duration-300 ${linkClass}`}
aria-label={`Switch to ${loc.fullLabel}`}
>