49 lines
1.2 KiB
Plaintext
49 lines
1.2 KiB
Plaintext
---
|
|
import { SUPPORTED_LANGUAGES, getLanguageFromPath, getLocalizedPath, type SupportedLanguage } from '../lib/i18n';
|
|
|
|
// Get current language from URL
|
|
const currentPath = Astro.url.pathname;
|
|
const currentLang = getLanguageFromPath(currentPath);
|
|
|
|
// Generate language options
|
|
const languageOptions = SUPPORTED_LANGUAGES.map(lang => ({
|
|
code: lang,
|
|
name: lang === 'es' ? 'Español' : 'English',
|
|
path: getLocalizedPath(currentPath, lang),
|
|
isCurrent: lang === currentLang
|
|
}));
|
|
---
|
|
|
|
<div class="language-switcher">
|
|
<select
|
|
id="language-select"
|
|
class="px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
|
|
onchange="window.location.href = this.value"
|
|
>
|
|
{languageOptions.map((option: any) => (
|
|
<option
|
|
value={option.path}
|
|
selected={option.isCurrent}
|
|
>
|
|
{option.name}
|
|
</option>
|
|
))}
|
|
</select>
|
|
</div>
|
|
|
|
<style>
|
|
.language-switcher {
|
|
display: inline-block;
|
|
}
|
|
|
|
.language-switcher select {
|
|
background-color: white;
|
|
font-size: 0.875rem;
|
|
line-height: 1.25rem;
|
|
}
|
|
|
|
.language-switcher select:focus {
|
|
outline: none;
|
|
box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
|
|
}
|
|
</style> |