Implementiere i18n für Frontend, Admin und Datenbank
This commit is contained in:
59
components/LanguageSwitcher.tsx
Normal file
59
components/LanguageSwitcher.tsx
Normal file
@@ -0,0 +1,59 @@
|
||||
'use client';
|
||||
|
||||
import { usePathname, useRouter } from '@/lib/navigation';
|
||||
import { useLocale } from 'next-intl';
|
||||
|
||||
export default function LanguageSwitcher() {
|
||||
const locale = useLocale();
|
||||
const router = useRouter();
|
||||
const pathname = usePathname();
|
||||
|
||||
const switchLocale = (newLocale: 'de' | 'en') => {
|
||||
router.replace(pathname, { locale: newLocale });
|
||||
};
|
||||
|
||||
return (
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
background: '#f3f4f6',
|
||||
borderRadius: '0.375rem',
|
||||
padding: '0.25rem',
|
||||
gap: '0.25rem'
|
||||
}}>
|
||||
<button
|
||||
onClick={() => switchLocale('de')}
|
||||
style={{
|
||||
padding: '0.375rem 0.75rem',
|
||||
background: locale === 'de' ? 'white' : 'transparent',
|
||||
border: 'none',
|
||||
borderRadius: '0.25rem',
|
||||
cursor: 'pointer',
|
||||
fontWeight: locale === 'de' ? '600' : '400',
|
||||
fontSize: '0.875rem',
|
||||
color: locale === 'de' ? '#111827' : '#6b7280',
|
||||
boxShadow: locale === 'de' ? '0 1px 2px rgba(0,0,0,0.05)' : 'none',
|
||||
transition: 'all 0.2s'
|
||||
}}
|
||||
>
|
||||
DE
|
||||
</button>
|
||||
<button
|
||||
onClick={() => switchLocale('en')}
|
||||
style={{
|
||||
padding: '0.375rem 0.75rem',
|
||||
background: locale === 'en' ? 'white' : 'transparent',
|
||||
border: 'none',
|
||||
borderRadius: '0.25rem',
|
||||
cursor: 'pointer',
|
||||
fontWeight: locale === 'en' ? '600' : '400',
|
||||
fontSize: '0.875rem',
|
||||
color: locale === 'en' ? '#111827' : '#6b7280',
|
||||
boxShadow: locale === 'en' ? '0 1px 2px rgba(0,0,0,0.05)' : 'none',
|
||||
transition: 'all 0.2s'
|
||||
}}
|
||||
>
|
||||
EN
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user