TheCloud/PronounsPage
1
0
Fork 0
mirror of https://gitlab.com/PronounsPage/PronounsPage.git synced 2025-09-24 05:05:20 -04:00
Code Issues Packages Projects Releases Wiki Activity

(a11y) make search button focusable

Browse Source
This commit is contained in:
Valentyne Stigloher 2025-04-15 16:18:49 +02:00
parent 6ef00ba113
commit a5c8702b4f
1 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
components/Header.vue
View File

@ -306,7 +306,7 @@ const dismissCensus = (): void => {
</template> </template>
</PotentiallyExternalLink> </PotentiallyExternalLink>
</template> </template>
<span class="nav-item btn btn-sm position-relative" @click="searchDialogue?.open()"> <button type="button" class="nav-item nav-header btn btn-sm position-relative" @click="searchDialogue?.open()">
<span style="position: absolute; right: 0.1em; top: 0.1em; opacity: 0.7; z-index: -1"> <span style="position: absolute; right: 0.1em; top: 0.1em; opacity: 0.7; z-index: -1">
<ClientOnly> <ClientOnly>
<kbd class="bg-light text-dark border">{{ isMac ? '⌘K' : 'Ctrl+K' }}</kbd> <kbd class="bg-light text-dark border">{{ isMac ? '⌘K' : 'Ctrl+K' }}</kbd>
@ -315,7 +315,7 @@ const dismissCensus = (): void => {
<Icon v="search" :size="1.6" /> <Icon v="search" :size="1.6" />
<br> <br>
<T>search.header</T> <T>search.header</T>
</span> </button>
<div class="nav-item flex-grow-0" @mouseenter="hoverItem = null"> <div class="nav-item flex-grow-0" @mouseenter="hoverItem = null">
<VersionDropdown end /> <VersionDropdown end />
</div> </div>
@ -370,10 +370,10 @@ const dismissCensus = (): void => {
<Spelling :text="link.textLong || link.text" /> <Spelling :text="link.textLong || link.text" />
</PotentiallyExternalLink> </PotentiallyExternalLink>
</template> </template>
<span class="btn btn-sm" @click="searchDialogue?.open()"> <button type="button" class="btn btn-sm" @click="searchDialogue?.open()">
<Icon v="search" /> <Icon v="search" />
<T>search.header</T> <T>search.header</T>
</span> </button>
</div> </div>
</div> </div>
</div> </div>