a11y: Add aria-label to search button

Before, screen readers would see the search button as a simply a button
with no context what it was for.

Now they can see it.
This commit is contained in:
Mark Stosberg 2023-01-16 20:59:31 -05:00 committed by Sodbileg Gansukh
parent 53ba32154b
commit e73ba698af
1 changed files with 4 additions and 4 deletions

View File

@ -51,7 +51,7 @@
{{/if}} {{/if}}
</a> </a>
</div> </div>
<button class="gh-search gh-icon-btn" data-ghost-search>{{> "icons/search"}}</button> <button class="gh-search gh-icon-btn" aria-label="Search this site" data-ghost-search>{{> "icons/search"}}</button>
<button class="gh-burger"></button> <button class="gh-burger"></button>
</div> </div>
@ -59,7 +59,7 @@
{{navigation}} {{navigation}}
{{#unless @site.members_enabled}} {{#unless @site.members_enabled}}
{{#match @custom.navigation_layout "Stacked"}} {{#match @custom.navigation_layout "Stacked"}}
<button class="gh-search gh-icon-btn" data-ghost-search>{{> "icons/search"}}</button> <button class="gh-search gh-icon-btn" aria-label="Search this site" data-ghost-search>{{> "icons/search"}}</button>
{{/match}} {{/match}}
{{/unless}} {{/unless}}
</nav> </nav>
@ -67,10 +67,10 @@
<div class="gh-head-actions"> <div class="gh-head-actions">
{{#unless @site.members_enabled}} {{#unless @site.members_enabled}}
{{^match @custom.navigation_layout "Stacked"}} {{^match @custom.navigation_layout "Stacked"}}
<button class="gh-search gh-icon-btn" data-ghost-search>{{> "icons/search"}}</button> <button class="gh-search gh-icon-btn" aria-label="Search this site" data-ghost-search>{{> "icons/search"}}</button>
{{/match}} {{/match}}
{{else}} {{else}}
<button class="gh-search gh-icon-btn" data-ghost-search>{{> "icons/search"}}</button> <button class="gh-search gh-icon-btn" aria-label="Search this site" data-ghost-search>{{> "icons/search"}}</button>
<div class="gh-head-members"> <div class="gh-head-members">
{{#unless @member}} {{#unless @member}}
{{#unless @site.members_invite_only}} {{#unless @site.members_invite_only}}