Denis Krylov
ec3f72113a
Some checks failed
Deploy monie-landing (kaniko) / build-and-deploy (push) Failing after 13s
47 lines
1.5 KiB
TypeScript
47 lines
1.5 KiB
TypeScript
// Locale switcher refs:
|
|
// - Paraglide docs: https://inlang.com/m/gerre34r/library-inlang-paraglideJs
|
|
// - Router example: https://github.com/TanStack/router/tree/main/examples/react/i18n-paraglide#switching-locale
|
|
import { getLocale, locales, setLocale } from '#/paraglide/runtime'
|
|
import { m } from '#/paraglide/messages'
|
|
|
|
export default function ParaglideLocaleSwitcher() {
|
|
const currentLocale = getLocale()
|
|
|
|
return (
|
|
<div
|
|
style={{
|
|
display: 'flex',
|
|
gap: '0.5rem',
|
|
alignItems: 'center',
|
|
color: 'inherit',
|
|
}}
|
|
aria-label={m.language_label()}
|
|
>
|
|
<span style={{ opacity: 0.85 }}>
|
|
{m.current_locale({ locale: currentLocale })}
|
|
</span>
|
|
<div style={{ display: 'flex', gap: '0.25rem' }}>
|
|
{locales.map((locale) => (
|
|
<button
|
|
key={locale}
|
|
onClick={() => setLocale(locale)}
|
|
aria-pressed={locale === currentLocale}
|
|
style={{
|
|
cursor: 'pointer',
|
|
padding: '0.35rem 0.75rem',
|
|
borderRadius: '999px',
|
|
border: '1px solid #d1d5db',
|
|
background: locale === currentLocale ? '#0f172a' : 'transparent',
|
|
color: locale === currentLocale ? '#f8fafc' : 'inherit',
|
|
fontWeight: locale === currentLocale ? 700 : 500,
|
|
letterSpacing: '0.01em',
|
|
}}
|
|
>
|
|
{locale.toUpperCase()}
|
|
</button>
|
|
))}
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|