Browse Source

Merge pull request #37335 from nextcloud/fix/36909-Decorative_icons_were_not_marked_as_such_with_aria-hidden=true

Add `aria-hidden='true'` to decorative icons inside of modal dialogs
tags/v27.0.0beta1
Julia Kirschenheuter 1 year ago
parent
commit
5aa1a470fe
No account linked to committer's email address

+ 5
- 5
apps/dashboard/src/DashboardApp.vue View File

<div id="app-dashboard"> <div id="app-dashboard">
<h2>{{ greeting.text }}</h2> <h2>{{ greeting.text }}</h2>
<ul class="statuses"> <ul class="statuses">
<div v-for="status in sortedRegisteredStatus"
<li v-for="status in sortedRegisteredStatus"
:id="'status-' + status" :id="'status-' + status"
:key="status"> :key="status">
<div :ref="'status-' + status" /> <div :ref="'status-' + status" />
</div>
</li>
</ul> </ul>


<Draggable v-model="layout" <Draggable v-model="layout"
:checked="isStatusActive(status)" :checked="isStatusActive(status)"
@input="updateStatusCheckbox(status, $event.target.checked)"> @input="updateStatusCheckbox(status, $event.target.checked)">
<label :for="'status-checkbox-' + status"> <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 }} {{ statusInfo[status].text }}
</label> </label>
</li> </li>
:checked="isActive(panel)" :checked="isActive(panel)"
@input="updateCheckbox(panel, $event.target.checked)"> @input="updateCheckbox(panel, $event.target.checked)">
<label :for="'panel-checkbox-' + panel.id" :class="{ draggable: isActive(panel) }"> <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 }} {{ panel.title }}
</label> </label>
</li> </li>
flex-wrap: wrap; flex-wrap: wrap;
margin-bottom: 36px; margin-bottom: 36px;


& > div {
& > li {
margin: 8px; margin: 8px;
} }
} }

+ 1
- 1
apps/user_status/src/UserStatus.vue View File

class="user-status-menu-item__toggle" class="user-status-menu-item__toggle"
href="#" href="#"
@click.prevent.stop="openModal"> @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 }} {{ visibleMessage }}
</toggle> </toggle>
</div> </div>

+ 1
- 1
apps/user_status/src/components/OnlineStatusSelect.vue View File

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

+ 1
- 1
apps/user_status/src/components/PredefinedStatus.vue View File

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

+ 8
- 0
apps/weather_status/src/App.vue View File

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

+ 2
- 2
dist/dashboard-main.js
File diff suppressed because it is too large
View File


+ 1
- 1
dist/dashboard-main.js.map
File diff suppressed because it is too large
View File


+ 2
- 2
dist/user-status-modal-8299.js
File diff suppressed because it is too large
View File


+ 1
- 1
dist/user-status-modal-8299.js.map
File diff suppressed because it is too large
View File


+ 2
- 2
dist/user_status-menu.js
File diff suppressed because it is too large
View File


+ 1
- 1
dist/user_status-menu.js.map
File diff suppressed because it is too large
View File


+ 2
- 2
dist/weather_status-weather-status.js
File diff suppressed because it is too large
View File


+ 1
- 1
dist/weather_status-weather-status.js.map
File diff suppressed because it is too large
View File


Loading…
Cancel
Save