einundzwanzig/einundzwanzig-app
1
0
Fork 0
mirror of https://github.com/HolgerHatGarKeineNode/einundzwanzig-app.git synced 2025-12-15 00:06:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

🌐 Add language selection accordion to welcome and login pages

Browse Source
This commit is contained in:
HolgerHatGarKeineNode
2025-11-21 20:04:58 +01:00
parent c7d2e573a5
commit ec2964608e
4 changed files with 50 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
resources/views/components/einundzwanzig/language-selector.blade.php Normal file
View File

@@ -0,0 +1,44 @@
<div class="mt-8">
<flux:accordion>
<flux:accordion.item>
<flux:accordion.heading>
<div class="flex items-center gap-2">
<flux:icon.language class="w-5 h-5" />
{{ __('Sprache wählen') }}
</div>
</flux:accordion.heading>
<flux:accordion.content>
@php
$languages = [
'de' => ['name' => 'Deutsch', 'countries' => ['de-DE', 'de-AT', 'de-CH']],
'en' => ['name' => 'English', 'countries' => ['en-GB', 'en-US', 'en-AU', 'en-CA']],
'es' => ['name' => 'Español', 'countries' => ['es-ES', 'es-CL', 'es-CO']],
];
$currentLangCountry = session('lang_country', config('lang-country.fallback'));
@endphp
<div class="grid grid-cols-2 gap-3 mt-2">
@foreach($languages as $langCode => $langData)
@foreach($langData['countries'] as $langCountry)
@php
[$lang, $countryCode] = explode('-', $langCountry);
$isActive = $currentLangCountry === $langCountry;
@endphp
<a href="{{ route('lang_country.switch', ['lang_country' => $langCountry]) }}"
class="flex flex-col items-center justify-center p-3 border rounded-lg hover:bg-zinc-100 dark:hover:bg-zinc-800 transition-colors {{ $isActive ? 'border-blue-500 bg-blue-50 dark:bg-blue-950' : 'border-zinc-200 dark:border-zinc-700' }}">
<img
alt="{{ strtolower($countryCode) }}"
src="{{ asset('vendor/blade-flags/country-'.strtolower($countryCode).'.svg') }}"
class="w-10 h-7 mb-1 object-cover"
/>
<span class="text-xs font-medium">{{ $langData['name'] }}</span>
<span class="text-[10px] text-zinc-500">{{ strtoupper($countryCode) }}</span>
</a>
@endforeach
@endforeach
</div>
</flux:accordion.content>
</flux:accordion.item>
</flux:accordion>
</div>