mirror of
https://github.com/elk-zone/elk.git
synced 2024-11-14 12:59:59 +00:00
feat(a11y): add semantic markup to preference settings (#2811)
This commit is contained in:
parent
57ff04853b
commit
77f0e2c2f8
1 changed files with 167 additions and 157 deletions
|
@ -15,6 +15,11 @@ const userSettings = useUserSettings()
|
|||
{{ $t('settings.preferences.label') }}
|
||||
</h1>
|
||||
</template>
|
||||
<section>
|
||||
<h2 px6 py4 mt2 font-bold text-xl flex="~ gap-1" items-center sr-only>
|
||||
<span aria-hidden="true" block i-ri-equalizer-line />
|
||||
{{ $t('settings.preferences.label') }}
|
||||
</h2>
|
||||
<SettingsToggleItem
|
||||
:checked="getPreferences(userSettings, 'hideAltIndicatorOnPosts')"
|
||||
@click="togglePreferences('hideAltIndicatorOnPosts')"
|
||||
|
@ -73,8 +78,10 @@ const userSettings = useUserSettings()
|
|||
>
|
||||
{{ $t('settings.preferences.use_star_favorite_icon') }}
|
||||
</SettingsToggleItem>
|
||||
</section>
|
||||
<section>
|
||||
<h2 px6 py4 mt2 font-bold text-xl flex="~ gap-1" items-center>
|
||||
<div i-ri-hearts-line />
|
||||
<span aria-hidden="true" block i-ri-hearts-line />
|
||||
{{ $t('settings.preferences.wellbeing') }}
|
||||
</h2>
|
||||
<SettingsToggleItem
|
||||
|
@ -131,8 +138,10 @@ const userSettings = useUserSettings()
|
|||
{{ $t('settings.preferences.zen_mode_description') }}
|
||||
</template>
|
||||
</SettingsToggleItem>
|
||||
</section>
|
||||
<section>
|
||||
<h2 px6 py4 mt2 font-bold text-xl flex="~ gap-1" items-center>
|
||||
<div i-ri-flask-line />
|
||||
<span aria-hidden="true" block i-ri-flask-line />
|
||||
{{ $t('settings.preferences.title') }}
|
||||
</h2>
|
||||
<!-- Embedded Media -->
|
||||
|
@ -172,5 +181,6 @@ const userSettings = useUserSettings()
|
|||
{{ $t('settings.preferences.user_picker_description') }}
|
||||
</template>
|
||||
</SettingsToggleItem>
|
||||
</section>
|
||||
</MainContent>
|
||||
</template>
|
||||
|
|
Loading…
Reference in a new issue