From b5562342071974915786b4f1653a9bbab59921d4 Mon Sep 17 00:00:00 2001
From: Art Lowel <art@atmire.com>
Date: Wed, 16 Jun 2021 13:05:03 +0200
Subject: [PATCH] add aria and alt attributes to base header as well

---
 src/app/header/header.component.html               | 6 +++---
 src/app/navbar/navbar.component.html               | 3 ++-
 src/assets/i18n/en.json5                           | 2 ++
 src/themes/dspace/app/header/header.component.html | 6 +++---
 src/themes/dspace/app/navbar/navbar.component.html | 4 ++--
 5 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/src/app/header/header.component.html b/src/app/header/header.component.html
index a1fa051610..c7b979d266 100644
--- a/src/app/header/header.component.html
+++ b/src/app/header/header.component.html
@@ -2,10 +2,10 @@
   <div class="container">
     <div class="d-flex flex-row justify-content-between">
       <a class="navbar-brand my-2" routerLink="/home">
-        <img src="assets/images/dspace-logo.svg"/>
+        <img src="assets/images/dspace-logo.svg" [attr.alt]="'menu.header.image.logo' | translate"/>
       </a>
 
-      <nav class="navbar navbar-light navbar-expand-md flex-shrink-0 px-0">
+      <nav role="navigation" [attr.aria-label]="'nav.user.description' | translate" class="navbar navbar-light navbar-expand-md flex-shrink-0 px-0">
         <ds-search-navbar></ds-search-navbar>
         <ds-lang-switch></ds-lang-switch>
         <ds-auth-nav-menu></ds-auth-nav-menu>
@@ -13,7 +13,7 @@
         <div class="pl-2">
           <button class="navbar-toggler" type="button" (click)="toggleNavbar()"
                   aria-controls="collapsingNav"
-                  aria-expanded="false" aria-label="Toggle navigation">
+                  aria-expanded="false" [attr.aria-label]="'nav.toggle' | translate">
             <span class="navbar-toggler-icon fas fa-bars fa-fw" aria-hidden="true"></span>
           </button>
         </div>
diff --git a/src/app/navbar/navbar.component.html b/src/app/navbar/navbar.component.html
index 2356077e43..3fa7598e74 100644
--- a/src/app/navbar/navbar.component.html
+++ b/src/app/navbar/navbar.component.html
@@ -1,6 +1,7 @@
 <nav [ngClass]="{'open': !(menuCollapsed | async)}"
      [@slideMobileNav]="!(windowService.isXsOrSm() | async) ? 'default' : ((menuCollapsed | async) ? 'collapsed' : 'expanded')"
-     class="navbar navbar-light navbar-expand-md p-md-0 navbar-container">    <!-- TODO remove navbar-container class when https://github.com/twbs/bootstrap/issues/24726 is fixed -->
+     class="navbar navbar-light navbar-expand-md p-md-0 navbar-container"
+     role="navigation" [attr.aria-label]="'nav.main.description' | translate">    <!-- TODO remove navbar-container class when https://github.com/twbs/bootstrap/issues/24726 is fixed -->
     <div class="container">
         <div class="reset-padding-md w-100">
             <div id="collapsingNav">
diff --git a/src/assets/i18n/en.json5 b/src/assets/i18n/en.json5
index 4c3317a0c0..5bd08dfbc8 100644
--- a/src/assets/i18n/en.json5
+++ b/src/assets/i18n/en.json5
@@ -2353,6 +2353,8 @@
 
   "nav.stop-impersonating": "Stop impersonating EPerson",
 
+  "nav.toggle" : "Toggle navigation",
+
   "nav.user.description" : "User profile bar",
 
 
diff --git a/src/themes/dspace/app/header/header.component.html b/src/themes/dspace/app/header/header.component.html
index dc0d066a4e..cf691ea6c4 100644
--- a/src/themes/dspace/app/header/header.component.html
+++ b/src/themes/dspace/app/header/header.component.html
@@ -1,8 +1,8 @@
 <header class="header">
-  <nav role="navigation" [attr.aria-label]="'nav.user.description' |translate" class="container navbar navbar-expand-md px-0">
+  <nav role="navigation" [attr.aria-label]="'nav.user.description' | translate" class="container navbar navbar-expand-md px-0">
     <div class="d-flex flex-grow-1">
       <a class="navbar-brand m-2" routerLink="/home">
-        <img src="assets/images/dspace-logo.svg" alt="logo"/>
+        <img src="assets/images/dspace-logo.svg" [attr.alt]="'menu.header.image.logo' | translate"/>
       </a>
     </div>
     <div class="d-flex flex-grow-1 ml-auto justify-content-end align-items-center">
@@ -13,7 +13,7 @@
       <div class="pl-2">
         <button class="navbar-toggler" type="button" (click)="toggleNavbar()"
                 aria-controls="collapsingNav"
-                aria-expanded="false" aria-label="Toggle navigation">
+                aria-expanded="false" [attr.aria-label]="'nav.toggle' | translate">
           <span class="navbar-toggler-icon fas fa-bars fa-fw" aria-hidden="true"></span>
         </button>
       </div>
diff --git a/src/themes/dspace/app/navbar/navbar.component.html b/src/themes/dspace/app/navbar/navbar.component.html
index 50e526b78b..5af30db632 100644
--- a/src/themes/dspace/app/navbar/navbar.component.html
+++ b/src/themes/dspace/app/navbar/navbar.component.html
@@ -1,10 +1,10 @@
 <nav [ngClass]="{'open': !(menuCollapsed | async)}"
      [@slideMobileNav]="!(windowService.isXsOrSm() | async) ? 'default' : ((menuCollapsed | async) ? 'collapsed' : 'expanded')"
      class="navbar navbar-expand-md navbar-light p-0 navbar-container"
-     role="navigation" role="navigation" [attr.aria-label]="'nav.main.description' |translate">
+     role="navigation" [attr.aria-label]="'nav.main.description' | translate">
   <div class="container h-100">
     <a class="navbar-brand my-2" routerLink="/home">
-      <img src="assets/images/dspace-logo.svg" alt="logo"/>
+      <img src="assets/images/dspace-logo.svg" [attr.alt]="'menu.header.image.logo' | translate"/>
     </a>
 
     <div id="collapsingNav" class="w-100 h-100">