Keeps menu open if user is hovering over it

src/app/app.component.html

@@ -8,6 +8,8 @@
     fxLayoutGap="20px"
     fxLayoutAlign="center end"
     [ngClass]="{'scrolling': isScrolling}"
+    (mouseover)="keepMenuOpen()"
+    (mouseout)="isScrolling = false"
  >
     <button mat-fab (click)="toggleMenu()" class="toggle-menu" color="primary">
       <mat-icon *ngIf="!isScrolling">menu</mat-icon>

src/app/app.component.ts

@@ -71,7 +71,7 @@ export class AppComponent implements AfterViewInit {
       clearTimeout(this.scrollTimer);
     }
 
-    this.scrollTimer = setTimeout(() => {
+    this.scrollTimer = window.setTimeout(() => {
       this.showIndicator = true;
       this.isScrolling = false;
       this.scrollTimer = -1;
@@ -83,4 +83,9 @@ export class AppComponent implements AfterViewInit {
     this.isScrolling = !this.isScrolling;
   }
 
+  keepMenuOpen() {
+    this.isScrolling = true;
+    clearTimeout(this.scrollTimer);
+  }
+
 }