MDL-81825 theme_boost: Refactor .sr-only usages for BS5

- Add .visually-hidden to the Boostratp 5 bridge SCSS file
- Replace .sr-only occurrences with .visually-hidden
- Replace .dropzone-sr-only-focusable  with .dropzone-visually-hidden-focusable
  for consistency
This commit is contained in:
Mikel Martín 2024-11-08 10:35:21 +01:00
parent 0888a6d324
commit f9abc562f5
220 changed files with 469 additions and 439 deletions

View file

@ -36,7 +36,7 @@
{{< core/drawer}}
{{$drawercontent}}
<div id="message-drawer-{{uniqid}}" class="message-app" data-region="message-drawer" role="region">
<h2 class="sr-only">{{#str}} messagingcategory,admin {{/str}}</h2>
<h2 class="visually-hidden">{{#str}} messagingcategory,admin {{/str}}</h2>
<div class="closewidget text-end pe-2">
<a class="text-dark btn-link" data-action="closedrawer" href="#"
title="{{#cleanstr}} closebuttontitle {{/cleanstr}}" aria-label="{{#cleanstr}} closebuttontitle {{/cleanstr}}"

View file

@ -104,7 +104,7 @@
data-region="unread-count"
>
<span aria-hidden="true">{{unreadcount}}</span>
<span class="sr-only">{{#str}} unreadmessages, core_message, {{unreadcount}} {{/str}}</span>
<span class="visually-hidden">{{#str}} unreadmessages, core_message, {{unreadcount}} {{/str}}</span>
</span>
<div class="text-muted ms-auto">

View file

@ -68,7 +68,7 @@
data-region="contact-request-count"
>
<span aria-hidden="true">{{contactrequestcount}}</span>
<span class="sr-only">{{#str}} pendingcontactrequests, core_message, {{contactrequestcount}} {{/str}}</span>
<span class="visually-hidden">{{#str}} pendingcontactrequests, core_message, {{contactrequestcount}} {{/str}}</span>
</span>
</a>
</li>

View file

@ -45,6 +45,6 @@
>
<span data-region="icon-container">{{#pix}} i/delete, core {{/pix}}</span>
<span class="hidden" data-region="loading-icon-container">{{> core/loading }}</span>
<span class="sr-only">{{#str}} deleteselectedmessages, core_message {{/str}}</span>
<span class="visually-hidden">{{#str}} deleteselectedmessages, core_message {{/str}}</span>
</button>
</div>

View file

@ -72,7 +72,7 @@
data-region="contact-request-count"
>
<span aria-hidden="true">{{contactrequestcount}}</span>
<span class="sr-only">{{#str}} pendingcontactrequests, core_message, {{contactrequestcount}} {{/str}}</span>
<span class="visually-hidden">{{#str}} pendingcontactrequests, core_message, {{contactrequestcount}} {{/str}}</span>
</span>
</a>
</div>

View file

@ -60,7 +60,7 @@
data-region="section-total-count-container" aria-labelledby="{{$region}}{{/region}}-total-count-label"
>
(<span aria-hidden="true" data-region="section-total-count">{{count.total}}</span>)
<span class="sr-only" id="{{$region}}{{/region}}-total-count-label">
<span class="visually-hidden" id="{{$region}}{{/region}}-total-count-label">
{{#str}} totalconversations, core_message, {{count.total}} {{/str}}
</span>
</small>
@ -72,7 +72,7 @@
data-region="section-unread-count-container" aria-labelledby="{{$region}}{{/region}}-unread-count-label"
>
<span aria-hidden="true" data-region="section-unread-count">{{count.unread}}</span>
<span class="sr-only" id="{{$region}}{{/region}}-unread-count-label">
<span class="visually-hidden" id="{{$region}}{{/region}}-unread-count-label">
{{#str}} unreadconversations, core_message, {{count.unread}} {{/str}}
</span>
</span>

View file

@ -40,7 +40,7 @@
<p>{{#str}} privacy_desc, message {{/str}}</p>
<div data-preference="blocknoncontacts" class="mb-3">
<fieldset>
<legend class="sr-only">{{#str}} contactableprivacy, message {{/str}}</legend>
<legend class="visually-hidden">{{#str}} contactableprivacy, message {{/str}}</legend>
{{#privacy}}
<div class="custom-control custom-radio mb-2">
<input

View file

@ -24,4 +24,4 @@
}
}}
<span class="sr-only sr-only-focusable" data-region="jumpto" tabindex="-1"></span>
<span class="visually-hidden visually-hidden-focusable" data-region="jumpto" tabindex="-1"></span>

View file

@ -44,7 +44,7 @@
data-region="count-container"
>
<span aria-hidden="true">{{unreadcount}}</span>
<span class="sr-only">{{#str}} unreadconversations, core_message, {{unreadcount}} {{/str}}</span>
<span class="visually-hidden">{{#str}} unreadconversations, core_message, {{unreadcount}} {{/str}}</span>
</div>
</a>
{{> core_message/message_jumpto }}

View file

@ -29,7 +29,7 @@
<form>
<p>
<label for="bulk-message">
<span class="sr-only">{{#str}}message, core_message{{/str}}</span>
<span class="visually-hidden">{{#str}}message, core_message{{/str}}</span>
</label>
<textarea id="bulk-message" rows="3" data-max-rows="10" data-auto-rows="true" cols="30" class="form-control"></textarea>
</p>