Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

add aria-hidden to non-descriptive icons #2844

Merged
merged 2 commits into from
Jun 8, 2020
Merged

add aria-hidden to non-descriptive icons #2844

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
3193533
Add aria-hidden attribute to menu icons
Pandoraaa Jun 8, 2020
9f92f67
Add aria-hidden attribute to non descriptive icons
Pandoraaa Jun 8, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion client/src/app/+admin/follows/following-list/following-list.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
<span class="sr-only" i18n>Clear filters</span>
</div>
<a class="ml-2 follow-button" (click)="addDomainsToFollow()" (key.enter)="addDomainsToFollow()">
<my-global-icon iconName="add"></my-global-icon>
<my-global-icon iconName="add" aria-hidden="true"></my-global-icon>
<ng-container i18n>Follow domain</ng-container>
</a>
</div>
Expand Down
2 changes: 1 addition & 1 deletion client/src/app/+admin/moderation/instance-blocklist/instance-server-blocklist.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
<span class="sr-only" i18n>Clear filters</span>
</div>
<a class="ml-2 block-button" (click)="addServersToBlock()" (key.enter)="addServersToBlock()">
<my-global-icon iconName="add"></my-global-icon>
<my-global-icon iconName="add" aria-hidden="true"></my-global-icon>
<ng-container i18n>Mute domain</ng-container>
</a>
</div>
Expand Down
2 changes: 1 addition & 1 deletion client/src/app/+admin/users/user-list/user-list.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<div i18n class="form-sub-title">Users list</div>

<a class="add-button" routerLink="/admin/users/create">
<my-global-icon iconName="add"></my-global-icon>
<my-global-icon iconName="add" aria-hidden="true"></my-global-icon>
<ng-container i18n>Create user</ng-container>
</a>
</div>
Expand Down
2 changes: 1 addition & 1 deletion client/src/app/+my-account/my-account-history/my-account-history.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
</div>

<button class="delete-history" (click)="deleteHistory()" i18n>
<my-global-icon iconName="delete"></my-global-icon>
<my-global-icon iconName="delete" aria-hidden="true"></my-global-icon>
Delete history
</button>
</div>
Expand Down
6 changes: 3 additions & 3 deletions client/src/app/+my-account/my-account-notifications/my-account-notifications.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
<div class="header">
<a routerLink="/my-account/settings" fragment="notifications" i18n>
<my-global-icon iconName="cog"></my-global-icon>
<my-global-icon iconName="cog" aria-hidden="true"></my-global-icon>
Notification preferences
</a>

<button class="btn" [disabled]="!hasUnreadNotifications()" (click)="markAllAsRead()">
<ng-container *ngIf="hasUnreadNotifications()">
<my-global-icon iconName="inbox-full"></my-global-icon>
<my-global-icon iconName="inbox-full" aria-hidden="true"></my-global-icon>

<span i18n>Mark all as read</span>
</ng-container>

<ng-container *ngIf="!hasUnreadNotifications()">
<my-global-icon iconName="circle-tick"></my-global-icon>
<my-global-icon iconName="circle-tick" aria-hidden="true"></my-global-icon>

<span i18n>All read</span>
</ng-container>
Expand Down
2 changes: 1 addition & 1 deletion ...nt/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<div class="video-channels-header">
<a class="create-button" routerLink="create">
<my-global-icon iconName="add"></my-global-icon>
<my-global-icon iconName="add" aria-hidden="true"></my-global-icon>
<ng-container i18n>Create video channel</ng-container>
</a>
</div>
Expand Down
2 changes: 1 addition & 1 deletion .../src/app/+my-account/my-account-video-playlists/my-account-video-playlists.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ <h4 i18n>Playlists <span class="badge badge-secondary">{{ pagination.totalItems
<input type="text" placeholder="Search your playlists" i18n-placeholder [(ngModel)]="videoPlaylistsSearch" (ngModelChange)="onVideoPlaylistSearchChanged()" />

<a class="create-button" routerLink="create">
<my-global-icon iconName="add"></my-global-icon>
<my-global-icon iconName="add" aria-hidden="true"></my-global-icon>
<ng-container i18n>Create playlist</ng-container>
</a>
</div>
Expand Down
2 changes: 1 addition & 1 deletion client/src/app/+my-account/my-account-videos/my-account-videos.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ <h4 i18n>Videos <span class="badge badge-secondary">{{ pagination.totalItems }}<
>
<ng-template ptTemplate="globalButtons">
<span class="action-button action-button-delete-selection" (click)="deleteSelectedVideos()">
<my-global-icon iconName="delete"></my-global-icon>
<my-global-icon iconName="delete" aria-hidden="true"></my-global-icon>
<ng-container i18n>Delete</ng-container>
</span>
</ng-template>
Expand Down
2 changes: 1 addition & 1 deletion client/src/app/header/header.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<my-search-typeahead class="w-100 d-flex justify-content-end"></my-search-typeahead>

<a class="upload-button" routerLink="/videos/upload">
<my-global-icon iconName="upload"></my-global-icon>
<my-global-icon iconName="upload" aria-hidden="true"></my-global-icon>
<span i18n class="upload-button-label">Upload</span>
</a>
2 changes: 1 addition & 1 deletion client/src/app/menu/avatar-notification.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@
></my-user-notifications>

<a *ngIf="loaded" class="all-notifications" routerLink="/my-account/notifications">
<my-global-icon class="mr-1" iconName="inbox-full"></my-global-icon>
<my-global-icon class="mr-1" iconName="inbox-full" aria-hidden="true"></my-global-icon>
<span i18n>See all your notifications</span>
</a>
</div>
Expand Down
46 changes: 23 additions & 23 deletions client/src/app/menu/menu.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,58 +16,58 @@

<div ngbDropdownMenu>
<a *ngIf="user.account" ngbDropdownItem ngbDropdownToggle class="dropdown-item" [routerLink]="[ '/accounts', user.account.nameWithHost ]">
<my-global-icon iconName="go"></my-global-icon> <ng-container i18n>Public profile</ng-container>
<my-global-icon iconName="go" aria-hidden="true"></my-global-icon> <ng-container i18n>Public profile</ng-container>
</a>

<div class="dropdown-divider"></div>

<a ngbDropdownItem ngbDropdownToggle class="dropdown-item" routerLink="/my-account">
<my-global-icon iconName="user"></my-global-icon> <ng-container i18n>Account settings</ng-container>
<my-global-icon iconName="user" aria-hidden="true"></my-global-icon> <ng-container i18n>Account settings</ng-container>
</a>

<a ngbDropdownItem ngbDropdownToggle class="dropdown-item" routerLink="/my-account/video-channels">
<my-global-icon iconName="folder"></my-global-icon> <ng-container i18n>Channels settings</ng-container>
<my-global-icon iconName="folder" aria-hidden="true"></my-global-icon> <ng-container i18n>Channels settings</ng-container>
</a>

<div class="dropdown-divider"></div>

<a ngbDropdownItem ngbDropdownToggle class="dropdown-item" (click)="openLanguageChooser()">
<my-global-icon iconName="language"></my-global-icon>
<my-global-icon iconName="language" aria-hidden="true"></my-global-icon>
<ng-container i18n>Interface: {{ language }}</ng-container>
<i class="ml-auto glyphicon glyphicon-menu-right"></i>
</a>

<a ngbDropdownItem ngbDropdownToggle class="dropdown-item" routerLink="/my-account/settings" fragment="video-settings">
<my-global-icon iconName="video-lang"></my-global-icon>
<my-global-icon iconName="video-lang" aria-hidden="true"></my-global-icon>
<ng-container i18n>Videos: {{ videoLanguages.join(', ') }}</ng-container>
<i class="ml-auto glyphicon glyphicon-menu-right"></i>
</a>

<a ngbDropdownItem ngbDropdownToggle class="dropdown-item" routerLink="/my-account/settings" fragment="video-settings">
<my-global-icon class="hover-display-toggle" [ngClass]="{ 'not-displayed': user.nsfwPolicy === 'display' }" iconName="sensitive"></my-global-icon>
<my-global-icon class="hover-display-toggle" [ngClass]="{ 'not-displayed': user.nsfwPolicy !== 'display' }" iconName="unsensitive"></my-global-icon>
<my-global-icon class="hover-display-toggle" [ngClass]="{ 'not-displayed': user.nsfwPolicy === 'display' }" iconName="sensitive" aria-hidden="true"></my-global-icon>
<my-global-icon class="hover-display-toggle" [ngClass]="{ 'not-displayed': user.nsfwPolicy !== 'display' }" iconName="unsensitive" aria-hidden="true"></my-global-icon>
<ng-container i18n>Sensitive: {{ nsfwPolicy }}</ng-container>
<i class="ml-auto glyphicon glyphicon-menu-right"></i>
</a>

<a ngbDropdownItem class="dropdown-item" (click)="toggleUseP2P()">
<my-global-icon iconName="p2p"></my-global-icon>
<my-global-icon iconName="p2p" aria-hidden="true"></my-global-icon>
<ng-container i18n>Help share videos</ng-container>
<input type="checkbox" [checked]="user.webTorrentEnabled"/><label class="ml-auto" for="switch">Toggle p2p</label>
</a>

<a ngbDropdownItem ngbDropdownToggle class="dropdown-item" routerLink="/my-account">
<my-global-icon iconName="more-horizontal"></my-global-icon> <ng-container i18n>More account settings</ng-container>
<my-global-icon iconName="more-horizontal" aria-hidden="true"></my-global-icon> <ng-container i18n>More account settings</ng-container>
</a>

<div class="dropdown-divider"></div>

<a ngbDropdownItem ngbDropdownToggle class="dropdown-item" (click)="openHotkeysCheatSheet()">
<i class="icon icon-shortcuts"></i> <ng-container i18n>Keyboard shortcuts</ng-container>
<i class="icon icon-shortcuts" aria-hidden="true"></i> <ng-container i18n>Keyboard shortcuts</ng-container>
</a>

<a ngbDropdownItem ngbDropdownToggle (click)="logout($event)" class="dropdown-item" href="#">
<my-global-icon iconName="sign-out"></my-global-icon> <ng-container i18n>Log out</ng-container>
<my-global-icon iconName="sign-out" aria-hidden="true"></my-global-icon> <ng-container i18n>Log out</ng-container>
</a>
</div>
</div>
Expand All @@ -82,22 +82,22 @@
<div i18n class="block-title">MY LIBRARY</div>

<a routerLink="/my-account/videos" routerLinkActive="active">
<my-global-icon iconName="videos"></my-global-icon>
<my-global-icon iconName="videos" aria-hidden="true"></my-global-icon>
<ng-container i18n>Videos</ng-container>
</a>

<a routerLink="/my-account/video-playlists" routerLinkActive="active">
<my-global-icon iconName="playlists"></my-global-icon>
<my-global-icon iconName="playlists" aria-hidden="true"></my-global-icon>
<ng-container i18n>Playlists</ng-container>
</a>

<a routerLink="/videos/subscriptions" routerLinkActive="active">
<my-global-icon iconName="subscriptions"></my-global-icon>
<my-global-icon iconName="subscriptions" aria-hidden="true"></my-global-icon>
<ng-container i18n>Subscriptions</ng-container>
</a>

<a routerLink="/my-account/history/videos" routerLinkActive="active">
<my-global-icon iconName="history"></my-global-icon>
<my-global-icon iconName="history" aria-hidden="true"></my-global-icon>
<ng-container i18n>History</ng-container>
</a>

Expand All @@ -107,27 +107,27 @@
<div i18n class="block-title">VIDEOS</div>

<a routerLink="/videos/overview" routerLinkActive="active">
<my-global-icon iconName="globe"></my-global-icon>
<my-global-icon iconName="globe" aria-hidden="true"></my-global-icon>
<ng-container i18n>Discover</ng-container>
</a>

<a routerLink="/videos/trending" routerLinkActive="active">
<my-global-icon iconName="trending"></my-global-icon>
<my-global-icon iconName="trending" aria-hidden="true"></my-global-icon>
<ng-container i18n>Trending</ng-container>
</a>

<a routerLink="/videos/most-liked" routerLinkActive="active">
<my-global-icon iconName="like"></my-global-icon>
<my-global-icon iconName="like" aria-hidden="true"></my-global-icon>
<ng-container i18n>Most liked</ng-container>
</a>

<a routerLink="/videos/recently-added" routerLinkActive="active">
<my-global-icon iconName="recently-added"></my-global-icon>
<my-global-icon iconName="recently-added" aria-hidden="true"></my-global-icon>
<ng-container i18n>Recently added</ng-container>
</a>

<a routerLink="/videos/local" routerLinkActive="active">
<my-global-icon iconName="home"></my-global-icon>
<my-global-icon iconName="home" aria-hidden="true"></my-global-icon>
<ng-container i18n>Local</ng-container>
</a>
</div>
Expand All @@ -136,15 +136,15 @@
<div class="footer">
<div class="panel-block">
<a *ngIf="userHasAdminAccess" [routerLink]="getFirstAdminRouteAvailable()" routerLinkActive="active">
<my-global-icon iconName="cog"></my-global-icon>
<my-global-icon iconName="cog" aria-hidden="true"></my-global-icon>
<ng-container i18n>Administration</ng-container>
</a>
<a *ngIf="!isLoggedIn" (click)="openQuickSettings()">
<my-global-icon iconName="cog"></my-global-icon>
<my-global-icon iconName="cog" aria-hidden="true"></my-global-icon>
<ng-container i18n>Settings</ng-container>
</a>
<a routerLink="/about/instance">
<my-global-icon iconName="help"></my-global-icon>
<my-global-icon iconName="help" aria-hidden="true"></my-global-icon>
<ng-container i18n>About</ng-container>
</a>
</div>
Expand Down
2 changes: 1 addition & 1 deletion client/src/app/shared/buttons/delete-button.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<span class="action-button action-button-delete grey-button" [title]="title" role="button">
<my-global-icon iconName="delete"></my-global-icon>
<my-global-icon iconName="delete" aria-hidden="true"></my-global-icon>

<span class="button-label" *ngIf="label">{{ label }}</span>
<span class="button-label" i18n *ngIf="!label">Delete</span>
Expand Down
2 changes: 1 addition & 1 deletion client/src/app/shared/buttons/edit-button.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<a class="action-button action-button-edit grey-button" [routerLink]="routerLink" i18n-title title="Edit">
<my-global-icon iconName="edit"></my-global-icon>
<my-global-icon iconName="edit" aria-hidden="true"></my-global-icon>

<span class="button-label" *ngIf="label">{{ label }}</span>
<span i18n class="button-label" *ngIf="!label">Edit</span>
Expand Down
6 changes: 3 additions & 3 deletions client/src/app/shared/users/user-notifications.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -81,23 +81,23 @@
</ng-container>

<ng-container *ngSwitchCase="UserNotificationType.MY_VIDEO_PUBLISHED">
<my-global-icon iconName="sparkle"></my-global-icon>
<my-global-icon iconName="sparkle" aria-hidden="true"></my-global-icon>

<div class="message" i18n>
Your video <a (click)="markAsRead(notification)" [routerLink]="notification.videoUrl">{{ notification.video.name }}</a> has been published
</div>
</ng-container>

<ng-container *ngSwitchCase="UserNotificationType.MY_VIDEO_IMPORT_SUCCESS">
<my-global-icon iconName="cloud-download"></my-global-icon>
<my-global-icon iconName="cloud-download" aria-hidden="true"></my-global-icon>

<div class="message" i18n>
<a (click)="markAsRead(notification)" [routerLink]="notification.videoUrl || notification.videoImportUrl">Your video import</a> {{ notification.videoImportIdentifier }} succeeded
</div>
</ng-container>

<ng-container *ngSwitchCase="UserNotificationType.MY_VIDEO_IMPORT_ERROR">
<my-global-icon iconName="cloud-error"></my-global-icon>
<my-global-icon iconName="cloud-error" aria-hidden="true"></my-global-icon>

<div class="message" i18n>
<a (click)="markAsRead(notification)" [routerLink]="notification.videoImportUrl">Your video import</a> {{ notification.videoImportIdentifier }} failed
Expand Down
4 changes: 2 additions & 2 deletions client/src/app/shared/video-playlist/video-add-to-playlist.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<div i18n class="title">Save to</div>

<div class="options" (click)="displayOptions = !displayOptions">
<my-global-icon iconName="cog"></my-global-icon>
<my-global-icon iconName="cog" aria-hidden="true"></my-global-icon>

<span i18n>Options</span>
</div>
Expand Down Expand Up @@ -60,7 +60,7 @@
</div>

<div class="new-playlist-button dropdown-item" (click)="openCreateBlock($event)" [hidden]="isNewPlaylistBlockOpened">
<my-global-icon iconName="add"></my-global-icon>
<my-global-icon iconName="add" aria-hidden="true"></my-global-icon>

<span i18n>Create a private playlist</span>
</div>
Expand Down
4 changes: 2 additions & 2 deletions client/src/app/shared/video-playlist/video-playlist-element-miniature.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@
<div ngbDropdownMenu>
<ng-container *ngIf="playlistElement.video">
<div class="dropdown-item" (click)="toggleDisplayTimestampsOptions($event, playlistElement)">
<my-global-icon iconName="edit"></my-global-icon>
<my-global-icon iconName="edit" aria-hidden="true"></my-global-icon>
<ng-container i18n>Edit starts/stops at</ng-container>
</div>

Expand Down Expand Up @@ -84,7 +84,7 @@
</ng-container>

<span class="dropdown-item" (click)="removeFromPlaylist(playlistElement)">
<my-global-icon iconName="delete"></my-global-icon>
<my-global-icon iconName="delete" aria-hidden="true"></my-global-icon>
<ng-container i18n>Delete from {{ playlist?.displayName }}</ng-container>
</span>
</div>
Expand Down
2 changes: 1 addition & 1 deletion client/src/app/videos/+video-edit/shared/video-edit.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -167,7 +167,7 @@

<div class="captions-header">
<a (click)="openAddCaptionModal()" class="create-caption">
<my-global-icon iconName="add"></my-global-icon>
<my-global-icon iconName="add" aria-hidden="true"></my-global-icon>
<ng-container i18n>Add another caption</ng-container>
</a>
</div>
Expand Down
2 changes: 1 addition & 1 deletion client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -69,7 +69,7 @@
(click)="updateSecondStep()"
[ngClass]="{ disabled: !form.valid || isUpdatingVideo === true }"
>
<my-global-icon iconName="validate"></my-global-icon>
<my-global-icon iconName="validate" aria-hidden="true"></my-global-icon>
<input type="button" i18n-value value="Update" />
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion client/src/app/videos/+video-edit/video-add-components/video-import-url.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,7 @@
(click)="updateSecondStep()"
[ngClass]="{ disabled: !form.valid || isUpdatingVideo === true }"
>
<my-global-icon iconName="validate"></my-global-icon>
<my-global-icon iconName="validate" aria-hidden="true"></my-global-icon>
<input type="button" i18n-value value="Update" />
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion client/src/app/videos/+video-edit/video-add-components/video-upload.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@
(click)="updateSecondStep()"
[ngClass]="{ disabled: isPublishingButtonDisabled() }"
>
<my-global-icon iconName="validate"></my-global-icon>
<my-global-icon iconName="validate" aria-hidden="true"></my-global-icon>
<input [disabled]="isPublishingButtonDisabled()" type="button" i18n-value value="Publish" />
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion client/src/app/videos/+video-edit/video-update.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@

<div class="submit-container">
<div class="submit-button" (click)="update()" [ngClass]="{ disabled: !form.valid || isUpdatingVideo === true }">
<my-global-icon iconName="validate"></my-global-icon>
<my-global-icon iconName="validate" aria-hidden="true"></my-global-icon>
<input type="button" i18n-value value="Update" />
</div>
</div>
Expand Down
4 changes: 2 additions & 2 deletions client/src/app/videos/+video-watch/video-watch.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -88,7 +88,7 @@ <h1 class="video-info-name">{{ video.name }}</h1>
</div>

<div (click)="showShareModal()" class="action-button" role="button">
<my-global-icon iconName="share"></my-global-icon>
<my-global-icon iconName="share" aria-hidden="true"></my-global-icon>
<span class="icon-text" i18n>SHARE</span>
</div>

Expand All @@ -99,7 +99,7 @@ <h1 class="video-info-name">{{ video.name }}</h1>
placement="bottom auto"
>
<div class="action-button action-button-save" ngbDropdownToggle role="button">
<my-global-icon iconName="playlist-add"></my-global-icon>
<my-global-icon iconName="playlist-add" aria-hidden="true"></my-global-icon>
<span class="icon-text" i18n>SAVE</span>
</div>

Expand Down