48 lines
1.5 KiB
HTML
48 lines
1.5 KiB
HTML
<h2 mat-dialog-title>{{ tr().settings.title }}</h2>
|
|
<mat-dialog-content>
|
|
<p>{{ tr().settings.description }}</p>
|
|
<div class="settings-controls">
|
|
<mat-form-field appearance="outline">
|
|
<mat-label>{{ tr().settings.selectTheme }}</mat-label>
|
|
<mat-select
|
|
[value]="themeService.themePreference()"
|
|
(valueChange)="themeService.setThemePreference($event)"
|
|
>
|
|
@for (preference of themePreferences; track preference) {
|
|
<mat-option [value]="preference">{{
|
|
tr().settings.themeOptions[preference]
|
|
}}</mat-option>
|
|
}
|
|
</mat-select>
|
|
@if (themeService.themePreference() === 'system') {
|
|
<mat-hint aria-live="polite">
|
|
{{ tr().settings.systemAppearance }}:
|
|
{{ tr().settings.themeOptions[themeService.effectiveTheme()] }}
|
|
</mat-hint>
|
|
}
|
|
</mat-form-field>
|
|
<mat-form-field appearance="outline">
|
|
<mat-label>{{ tr().settings.selectLanguage }}</mat-label>
|
|
<mat-select
|
|
[value]="translationService.language()"
|
|
(valueChange)="translationService.setLanguage($event)"
|
|
>
|
|
@for (lang of translationService.availableLanguages; track lang) {
|
|
<mat-option [value]="lang">{{
|
|
translationService.getLanguageName(lang)
|
|
}}</mat-option>
|
|
}
|
|
</mat-select>
|
|
</mat-form-field>
|
|
<mat-slide-toggle
|
|
[checked]="showWeekNumbers()"
|
|
(change)="showWeekNumbers.set($event.checked)"
|
|
>
|
|
{{ tr().settings.showWeekNumbers }}
|
|
</mat-slide-toggle>
|
|
</div>
|
|
</mat-dialog-content>
|
|
<mat-dialog-actions align="end">
|
|
<button mat-button type="button" mat-dialog-close>{{ tr().settings.close }}</button>
|
|
</mat-dialog-actions>
|