Fix errors and warnings on login/logout

src/app/app.component.ts

@@ -63,8 +63,8 @@ export class AppComponent {
   }
 
   logout() {
+    this.navService.closeNav();
     this.authService.logout().subscribe().add(() => this.router.navigate(['login']));
-    this.sideNav.close();
   }
 
   ngAfterViewInit() {

src/app/components/sidenav-profile/sidenav-profile.component.html

@@ -1,4 +1,4 @@
-<div routerLink = "/profile" >
+<div routerLink = "/profile" class="sidenav-profile">
     <img class="navbar-photo" src={{profileURL}}>
     <p>{{name}}</p>
     <p>{{email}}</p>

src/app/components/sidenav-profile/sidenav-profile.component.scss

@@ -6,3 +6,7 @@
     border-radius:50%;
     margin-top:10px;
 }
+
+.sidenav-profile {
+    outline: none;
+}

src/app/pages/login/login.component.html

@@ -1,8 +1,9 @@
-<div id="login-form">
+<div id="login-wrapper">
   <h1>fLotte Login</h1>
+  <form id="login-form">
     <mat-form-field (keyup.enter)="login()">
       <mat-label>E-Mail-Adresse eingeben</mat-label>
-    <input matInput placeholder="fLotte@beispiel.de" [formControl]="email" />
+      <input matInput placeholder="fLotte@beispiel.de" autocomplete="email" [formControl]="email" />
       <mat-error *ngIf="email.hasError('required')">
         Bitte geben Sie eine E-Mail-Adresse ein.
       </mat-error>
@@ -15,6 +16,7 @@
       <mat-label>Passwort eingeben</mat-label>
       <input
         matInput
+        autocomplete="password"
         [type]="hide ? 'password' : 'text'"
         [formControl]="password"
       />
@@ -31,11 +33,14 @@
         <mat-icon>{{ hide ? "visibility_off" : "visibility" }}</mat-icon>
       </button>
     </mat-form-field>
-  <mat-progress-bar mode="indeterminate" id="loading-bar" *ngIf="loading"></mat-progress-bar>
+  </form>
-  <button mat-stroked-button color="primary" (click)="login()">
+  <mat-progress-bar
-    Login
+    mode="indeterminate"
-  </button>
+    id="loading-bar"
+    *ngIf="loading"
+  ></mat-progress-bar>
+  <button mat-stroked-button color="primary" (click)="login()">Login</button>
   <mat-error class="login-error-message" *ngIf="errorOccurred">
-    {{errorMessage}}
+    {{ errorMessage }}
   </mat-error>
 </div>

src/app/pages/login/login.component.scss

@@ -1,4 +1,7 @@
-#login-form {
+#login-wrapper {
+    #login-form {
+        display: contents;
+    }
     display: flex;
     flex-direction: column;
     max-width: 32em;