* nav mobil menu fix

* auth title setting

src/app/auth/auth/auth.component.ts

@@ -1,6 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import { AuthService } from "../auth.service";
 import { Router } from "@angular/router";
+import { Title } from "@angular/platform-browser";
 
 @Component({
     selector: 'app-auth',
@@ -14,7 +15,8 @@ export class AuthComponent implements OnInit {
 
     constructor(
         private authService: AuthService,
-        private router: Router
+        private router: Router,
+        private titleService: Title,
     ) {
         switch (this.router.url) {
             case '/logout':
@@ -28,6 +30,7 @@ export class AuthComponent implements OnInit {
         if (this.authService.isLoggedIn) {
             this.router.navigate(['/']);
         }
+        this.titleService.setTitle('Gran Prize Admin')
     }
 
     get canLogin(): boolean {

src/app/navigation/navigation.component.html

@@ -1,11 +1,11 @@
 <mat-sidenav-container class="sidenav-container">
-  <mat-sidenav *ngIf="loggedIn"
+  <mat-sidenav
     #drawer
     class="sidenav"
     fixedInViewport="true"
     [attr.role]="isHandset ? 'dialog' : 'navigation'"
     [mode]="(isHandset | async)!.matches ? 'over' : 'side'"
-    [opened]="!(isHandset | async)!.matches">
+    [opened]="loggedIn && !(isHandset | async)!.matches">
     <mat-toolbar color="primary">Menu</mat-toolbar>
     <mat-nav-list>
       <a mat-list-item [routerLink]="['judges']">
@@ -23,13 +23,13 @@
     </mat-nav-list>
   </mat-sidenav>
   <mat-sidenav-content>
-    <mat-toolbar color="primary" *ngIf="loggedIn">
+    <mat-toolbar color="primary">
       <button
         type="button"
         aria-label="Toggle sidenav"
         mat-icon-button
-        (click)="drawer.toggle()"
-        *ngIf="(isHandset | async)!.matches">
+        (click)="toggleMenu()"
+        *ngIf="loggedIn && ((isHandset | async)!.matches)">
         <mat-icon aria-label="Side nav toggle icon">menu</mat-icon>
       </button>
       <span>{{title}}</span>

src/app/navigation/navigation.component.ts

@@ -1,8 +1,9 @@
-import { Component } from '@angular/core';
+import { Component, ViewChild } from '@angular/core';
 import { BreakpointObserver, Breakpoints, BreakpointState } from '@angular/cdk/layout';
 import { Observable } from 'rxjs';
 import { Title } from "@angular/platform-browser";
 import { AuthService } from "../auth/auth.service";
+import { MatSidenav } from "@angular/material";
 
 @Component({
   selector: 'app-navigation',
@@ -10,6 +11,7 @@ import { AuthService } from "../auth/auth.service";
   styleUrls: ['./navigation.component.css']
 })
 export class NavigationComponent {
+  @ViewChild(MatSidenav) draver: MatSidenav;
   isHandset: Observable<BreakpointState> = this.breakpointObserver.observe(Breakpoints.Handset);
   constructor(
     private breakpointObserver: BreakpointObserver,
@@ -23,4 +25,10 @@ export class NavigationComponent {
   get loggedIn(): boolean {
     return this.authService.isLoggedIn;
   }
+
+  public toggleMenu() {
+    if (this.loggedIn) {
+      this.draver.toggle();
+    }
+  }
 }