26 lines
1.1 KiB
HTML
26 lines
1.1 KiB
HTML
|
<div class="language-selector">
|
||
|
|
<button class="language-button" (click)="toggleDropdown()">
|
||
|
|
<img [src]="languageService.getCurrentLanguage()?.flagSvg"
|
||
|
|
[alt]="languageService.getCurrentLanguage()?.name"
|
||
|
|
class="language-flag">
|
||
|
|
<span class="language-code">{{ languageService.getCurrentLanguage()?.code?.toUpperCase() }}</span>
|
||
|
|
<svg class="dropdown-arrow" [class.rotated]="dropdownOpen" width="12" height="12" viewBox="0 0 12 12" fill="none">
|
||
|
|
<path d="M2.5 4.5L6 8L9.5 4.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||
|
|
</svg>
|
||
|
|
</button>
|
||
|
|
|
||
|
|
<div class="language-dropdown" [class.open]="dropdownOpen">
|
||
|
|
@for (lang of languageService.languages; track lang.code) {
|
||
|
|
<button
|
||
|
|
class="language-option"
|
||
|
|
[class.active]="languageService.currentLanguage() === lang.code"
|
||
|
|
[class.disabled]="!lang.enabled"
|
||
|
|
[disabled]="!lang.enabled"
|
||
|
|
(click)="selectLanguage(lang)">
|
||
|
|
<img [src]="lang.flagSvg" [alt]="lang.name" class="option-flag">
|
||
|
|
<span class="option-name">{{ lang.name }}</span>
|
||
|
|
</button>
|
||
|
|
}
|
||
|
|
</div>
|
||
|
|
</div>
|