add assistive technology accessible label for search input in settings modal

This commit is contained in:
Sine Jespersen 2025-06-10 10:27:06 +02:00
parent af0f2a678e
commit 7fd5304e76

View File

@ -571,10 +571,12 @@
strokeWidth={($settings.highContrastMode ?? false) ? '3' : '1.5'} strokeWidth={($settings.highContrastMode ?? false) ? '3' : '1.5'}
/> />
</div> </div>
<label class="sr-only" for="search-input-settings-modal">{$i18n.t('Search')}</label>
<input <input
class={`w-full py-1.5 text-sm bg-transparent dark:text-gray-300 outline-hidden class={`w-full py-1.5 text-sm bg-transparent dark:text-gray-300 outline-hidden
${($settings.highContrastMode ?? false) ? 'placeholder-gray-800' : ''}`} ${($settings.highContrastMode ?? false) ? 'placeholder-gray-800' : ''}`}
bind:value={search} bind:value={search}
id="search-input-settings-modal"
on:input={searchDebounceHandler} on:input={searchDebounceHandler}
placeholder={$i18n.t('Search')} placeholder={$i18n.t('Search')}
/> />