Add title to left menu toggle

diff --git a/client/src/app/app.component.html b/client/src/app/app.component.html
index 9a8a8e14f30b0fd586711fe0ae958894abf92833..77d876f8edb880a6dc2e64c0e00f9337a05fd0d9 100644 (file)
--- a/client/src/app/app.component.html
+++ b/client/src/app/app.component.html
@@ -6,7 +6,7 @@
   <div class="header">
 
     <div class="top-left-block">
-      <span class="icon icon-menu" (click)="menu.toggleMenu()"></span>
+      <span class="icon icon-menu" role="button" [title]="getToggleTitle()" (click)="menu.toggleMenu()"></span>
 
       <a class="peertube-title" [routerLink]="defaultRoute">
         <span class="icon icon-logo"></span>

diff --git a/client/src/app/app.component.ts b/client/src/app/app.component.ts
index 75f4bdfe62d9b8c1e10dcf09dfb0649b58013675..3d1026ac40a10003717e39a83ea2c0791f3acddb 100644 (file)
--- a/client/src/app/app.component.ts
+++ b/client/src/app/app.component.ts
@@ -103,6 +103,12 @@ export class AppComponent implements OnInit, AfterViewInit {
     this.pluginService.initializeCustomModal(this.customModal)
   }
 
+  getToggleTitle () {
+    if (this.menu.isDisplayed()) return $localize`Close the left menu`
+
+    return $localize`Open the left menu`
+  }
+
   isUserLoggedIn () {
     return this.authService.isLoggedIn()
   }

diff --git a/client/src/app/core/menu/menu.service.ts b/client/src/app/core/menu/menu.service.ts
index 9c0433bca76fbf18506a3c49d125da2200e48bf1..502d3bb2fa538eb1c373e3e4c8ad3dcda678185b 100644 (file)
--- a/client/src/app/core/menu/menu.service.ts
+++ b/client/src/app/core/menu/menu.service.ts
@@ -25,6 +25,10 @@ export class MenuService {
     this.isMenuChangedByUser = true
   }
 
+  isDisplayed () {
+    return this.isMenuDisplayed
+  }
+
   setMenuDisplay (display: boolean) {
     this.isMenuDisplayed = display