add aria-hidden to non-descriptive icons (#2844)

2020-06-08 19:42:51 +02:00 · 2020-06-08 19:42:51 +02:00 · 6ad971d5f5
parent c2caa99b94
commit 6ad971d5f5
22 changed files with 51 additions and 51 deletions
--- a/client/src/app/+admin/follows/following-list/following-list.component.html
+++ b/client/src/app/+admin/follows/following-list/following-list.component.html
@ -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>
--- a/client/src/app/+admin/moderation/instance-blocklist/instance-server-blocklist.component.html
+++ b/client/src/app/+admin/moderation/instance-blocklist/instance-server-blocklist.component.html
@ -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>
--- a/client/src/app/+admin/users/user-list/user-list.component.html
+++ b/client/src/app/+admin/users/user-list/user-list.component.html
@ -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>
--- a/client/src/app/+my-account/my-account-history/my-account-history.component.html
+++ b/client/src/app/+my-account/my-account-history/my-account-history.component.html
@ -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>
--- a/client/src/app/+my-account/my-account-notifications/my-account-notifications.component.html
+++ b/client/src/app/+my-account/my-account-notifications/my-account-notifications.component.html
@ -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>
--- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.html
+++ b/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.html
@ -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>
--- a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlists.component.html
+++ b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlists.component.html
@ -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>
--- a/client/src/app/+my-account/my-account-videos/my-account-videos.component.html
+++ b/client/src/app/+my-account/my-account-videos/my-account-videos.component.html
@ -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>
--- a/client/src/app/header/header.component.html
+++ b/client/src/app/header/header.component.html
@ -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>
--- a/client/src/app/menu/avatar-notification.component.html
+++ b/client/src/app/menu/avatar-notification.component.html
@ -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>
--- a/client/src/app/menu/menu.component.html
+++ b/client/src/app/menu/menu.component.html
@ -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>
@ -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>

@ -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>
@ -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>
--- a/client/src/app/shared/buttons/delete-button.component.html
+++ b/client/src/app/shared/buttons/delete-button.component.html
@ -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>
--- a/client/src/app/shared/buttons/edit-button.component.html
+++ b/client/src/app/shared/buttons/edit-button.component.html
@ -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>
--- a/client/src/app/shared/users/user-notifications.component.html
+++ b/client/src/app/shared/users/user-notifications.component.html
@ -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
--- a/client/src/app/shared/video-playlist/video-add-to-playlist.component.html
+++ b/client/src/app/shared/video-playlist/video-add-to-playlist.component.html
@ -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>
--- a/client/src/app/shared/video-playlist/video-playlist-element-miniature.component.html
+++ b/client/src/app/shared/video-playlist/video-playlist-element-miniature.component.html
@ -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>
--- a/client/src/app/videos/+video-edit/shared/video-edit.component.html
+++ b/client/src/app/videos/+video-edit/shared/video-edit.component.html
@ -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>
--- a/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.html
+++ b/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.html
@ -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>
--- a/client/src/app/videos/+video-edit/video-add-components/video-import-url.component.html
+++ b/client/src/app/videos/+video-edit/video-add-components/video-import-url.component.html
@ -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>
--- a/client/src/app/videos/+video-edit/video-add-components/video-upload.component.html
+++ b/client/src/app/videos/+video-edit/video-add-components/video-upload.component.html
@ -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>
--- a/client/src/app/videos/+video-edit/video-update.component.html
+++ b/client/src/app/videos/+video-edit/video-update.component.html
@ -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>
--- a/client/src/app/videos/+video-watch/video-watch.component.html
+++ b/client/src/app/videos/+video-watch/video-watch.component.html
@ -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>