Add `aria-hidden='true'` to decorative icons inside of modal dialogs

Signed-off-by: julia.kirschenheuter <julia.kirschenheuter@nextcloud.com>
pull/37335/head
julia.kirschenheuter 2023-04-06 11:10:42 +07:00
parent f61bcd8b5f
commit 0df1361ddd
13 changed files with 28 additions and 20 deletions

@ -2,11 +2,11 @@
<div id="app-dashboard">
<h2>{{ greeting.text }}</h2>
<ul class="statuses">
<div v-for="status in sortedRegisteredStatus"
<li v-for="status in sortedRegisteredStatus"
:id="'status-' + status"
:key="status">
<div :ref="'status-' + status" />
</div>
</li>
</ul>
<Draggable v-model="layout"
@ -51,7 +51,7 @@
:checked="isStatusActive(status)"
@input="updateStatusCheckbox(status, $event.target.checked)">
<label :for="'status-checkbox-' + status">
<div :class="statusInfo[status].icon" role="img" />
<div :class="statusInfo[status].icon" aria-hidden="true" role="img" />
{{ statusInfo[status].text }}
</label>
</li>
@ -69,7 +69,7 @@
:checked="isActive(panel)"
@input="updateCheckbox(panel, $event.target.checked)">
<label :for="'panel-checkbox-' + panel.id" :class="{ draggable: isActive(panel) }">
<div :class="panel.iconClass" role="img" />
<div :class="panel.iconClass" aria-hidden="true" role="img" />
{{ panel.title }}
</label>
</li>
@ -627,7 +627,7 @@ export default {
flex-wrap: wrap;
margin-bottom: 36px;
& > div {
& > li {
margin: 8px;
}
}

@ -43,7 +43,7 @@
class="user-status-menu-item__toggle"
href="#"
@click.prevent.stop="openModal">
<span :class="statusIcon" class="user-status-menu-item__toggle-icon" />
<span aria-hidden="true" :class="statusIcon" class="user-status-menu-item__toggle-icon" />
{{ visibleMessage }}
</toggle>
</div>

@ -29,7 +29,7 @@
@change="onChange">
<label :for="id" class="user-status-online-select__label">
{{ label }}
<span :class="icon" role="img" />
<span :class="icon" aria-hidden="true" role="img" />
<em class="user-status-online-select__subline">{{ subline }}</em>
</label>
</div>

@ -24,7 +24,7 @@
@keyup.enter="select"
@keyup.space="select"
@click="select">
<span class="predefined-status__icon">
<span aria-hidden="true" class="predefined-status__icon">
{{ icon }}
</span>
<span class="predefined-status__message">

@ -24,32 +24,38 @@
<div id="weather-status-menu-item">
<NcActions class="weather-status-menu-item__subheader"
:default-icon="weatherIcon"
:aria-hidden="true"
:menu-title="currentWeatherMessage">
<NcActionText v-if="gotWeather"
:aria-hidden="true"
:icon="futureWeatherIcon">
{{ forecastMessage }}
</NcActionText>
<NcActionLink v-if="gotWeather"
icon="icon-address"
target="_blank"
:aria-hidden="true"
:href="weatherLinkTarget"
:close-after-click="true">
{{ locationText }}
</NcActionLink>
<NcActionButton v-if="gotWeather"
:icon="addRemoveFavoriteIcon"
:aria-hidden="true"
@click="onAddRemoveFavoriteClick">
{{ addRemoveFavoriteText }}
</NcActionButton>
<NcActionSeparator v-if="address && !errorMessage" />
<NcActionButton icon="icon-crosshair"
:close-after-click="true"
:aria-hidden="true"
@click="onBrowserLocationClick">
{{ t('weather_status', 'Detect location') }}
</NcActionButton>
<NcActionInput ref="addressInput"
:disabled="false"
icon="icon-rename"
:aria-hidden="true"
type="text"
value=""
@submit="onAddressSubmit">
@ -57,12 +63,14 @@
</NcActionInput>
<NcActionButton v-show="favorites.length > 0"
:icon="toggleFavoritesIcon"
:aria-hidden="true"
@click="showFavorites = !showFavorites">
{{ t('weather_status', 'Favorites') }}
</NcActionButton>
<NcActionButton v-for="f in displayedFavorites"
:key="f"
icon="icon-starred"
:aria-hidden="true"
@click="onFavoriteClick($event, f)">
{{ f }}
</NcActionButton>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long