add aria-hidden to non-descriptive icons (#2844)
authorCaroline Chuong <caroline.chuong@octo.com>
Mon, 8 Jun 2020 17:42:51 +0000 (19:42 +0200)
committerGitHub <noreply@github.com>
Mon, 8 Jun 2020 17:42:51 +0000 (19:42 +0200)
22 files changed:
client/src/app/+admin/follows/following-list/following-list.component.html
client/src/app/+admin/moderation/instance-blocklist/instance-server-blocklist.component.html
client/src/app/+admin/users/user-list/user-list.component.html
client/src/app/+my-account/my-account-history/my-account-history.component.html
client/src/app/+my-account/my-account-notifications/my-account-notifications.component.html
client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.html
client/src/app/+my-account/my-account-video-playlists/my-account-video-playlists.component.html
client/src/app/+my-account/my-account-videos/my-account-videos.component.html
client/src/app/header/header.component.html
client/src/app/menu/avatar-notification.component.html
client/src/app/menu/menu.component.html
client/src/app/shared/buttons/delete-button.component.html
client/src/app/shared/buttons/edit-button.component.html
client/src/app/shared/users/user-notifications.component.html
client/src/app/shared/video-playlist/video-add-to-playlist.component.html
client/src/app/shared/video-playlist/video-playlist-element-miniature.component.html
client/src/app/videos/+video-edit/shared/video-edit.component.html
client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.html
client/src/app/videos/+video-edit/video-add-components/video-import-url.component.html
client/src/app/videos/+video-edit/video-add-components/video-upload.component.html
client/src/app/videos/+video-edit/video-update.component.html
client/src/app/videos/+video-watch/video-watch.component.html

index 61b8133055cf9087e303ff9e3fd7a883fd1435ad..ed521d6503fae0085a0e28d1e3ce7d24dc4c7c0a 100644 (file)
@@ -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>
index 589a11b7b317226649cfdbc1efa70090d364f944..7a77b8842b0975c89ef7697c2656fbd651c2c699 100644 (file)
@@ -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>
index 6caf372121a7146425ecc4be6759a83dbe943176..6c6c64194cb9b07c37e1d9a37b3bdcf69716b148 100644 (file)
@@ -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>
index 56d63f2996e6122b10550ede33e813679b76cac6..d3a329e8f449d5ac5aa2dcdde0d2cd2a45eafa28 100644 (file)
@@ -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>
index dec3b14cc123acc0e14c7fca2d2d4ba10f06c2cb..429943f7113300c8f684dc33cc583aa984cd6240 100644 (file)
@@ -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>
index 4cf08ab66790f4aef7fff9c50b56113c99799270..6fd94474d846573531c022c694bd1e76da8de08a 100644 (file)
@@ -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>
index 86844ce0199083198280164338bb0bdbb7646f84..7bd2fa19f4fb19e3a63472e9eea374f338513131 100644 (file)
@@ -4,7 +4,7 @@
   <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>
index 55cbfda957b575e5c4e169d749c3ad26a10f0f1d..9192aec6d542e7d75919f82cae6cefae9a6d0f5c 100644 (file)
@@ -17,7 +17,7 @@
 >
   <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>
index 49e219187405c398ee903cd12036604955e9a88c..525a04e9cd0d16fa8cd94cf193fb457ba31f9195 100644 (file)
@@ -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>
index df2a102a3f6974fb08673ccfb85db0aea50374e2..7999b334649c79e3ca2afc3be5ba86db1acd94d9 100644 (file)
@@ -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>
index 87d8d86d432e477c4f7bae01643305c475829fa5..f748a47d5f29509a0cc5851018c28e24c2601c71 100644 (file)
 
           <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>
         <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>
 
         <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>
     <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>
index 25196fbd5650f74f5eeeafedd44101f0c9bc3be6..398b6db1eb308a6b22f9669456fc346a68cca7cd 100644 (file)
@@ -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>
index 3d7cd47803ef3cc591f9e9af238d645d24e7b005..b852bb38a36f29cdca4f7d57c5a4a3144658f00a 100644 (file)
@@ -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>
index 108122b57ddf8ab4afefa2987ed082176d27862b..8dbe6e329dd2150d5b9a308f4ef306b92aebcb97 100644 (file)
@@ -81,7 +81,7 @@
       </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
@@ -89,7 +89,7 @@
       </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
@@ -97,7 +97,7 @@
       </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
index 58108584bac7f7379eed3f7f5a5e6eabea88b0a2..a40e0699e49895d5d0be36d8654c1375f1c5a587 100644 (file)
@@ -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>
@@ -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>
index c956e6cd2b728dc8a554a20a999838bf69c83e49..e3f7ef017e773f2180b874d5b7d010371549d344 100644 (file)
@@ -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>
 
@@ -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>
index 9a0e4f848da50af51892452ca3bf90818f356c13..c11a60dce6713530cae1ed8c800d4755142c5636 100644 (file)
 
           <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>
index c2ee3ad572f7c09d2271c15b76f9374955eaab21..89948dac85dec41809eae823476de9af678781ea 100644 (file)
@@ -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>
index 9a26fe3082edfae92b364a404beec5506aa429e2..54bbe8123d38f4b3d3b2cbe2d048f9759a7db253 100644 (file)
@@ -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>
index 950e55a52141c8f044b0a3a17257767fb2254312..a2c8af2ae74ac8125f177bb1ce200275e5becadf 100644 (file)
@@ -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>
index e68c1401034f1ae6a46a12061e0ef7879db4c487..fbc642db9176ed29025da92fbd748243fd4968e0 100644 (file)
@@ -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>
index 0244860dd0a4bb767d916678391d8af7daf56c6a..433543a7bc7c8455c209cdca93afd21db30535e4 100644 (file)
@@ -88,7 +88,7 @@
                   </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>
 
@@ -99,7 +99,7 @@
                      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>