improvements+fixes

src/app/ui/comment/comment.ui.html

@@ -15,7 +15,7 @@
     </a>
   </small>
 </div>
-<div mat-line>
+<div mat-line class="text">
   {{comment.text}}
 </div>
 

src/app/ui/comment/comment.ui.scss

@@ -6,4 +6,10 @@ small a {
 small a:hover {
   color: inherit !important;
   text-decoration: underline;
-}
+}
+
+.text {
+  max-width: 100%;
+  white-space: break-spaces;
+  word-break: break-all;
+}

src/app/ui/commentform/commentform.ui.html

@@ -1,7 +1,7 @@
 <form [formGroup]="form" (ngSubmit)="create()" #formDirective="ngForm">
 
   <mat-form-field>
-    <textarea matInput formControlName="text" placeholder="{{'comment.text' | i18n}}" required></textarea>
+    <textarea [mat-autosize] [matAutosizeMinRows]="3" matInput formControlName="text" placeholder="{{'comment.text' | i18n}}" required></textarea>
     <mat-error *ngIf="hasError('text')">
       {{'comment.text.error' | i18n}}
     </mat-error>

src/app/ui/entries/entries.ui.html

@@ -1,7 +1,7 @@
 <mat-progress-bar *ngIf="!entries || !entries.content" mode="indeterminate"></mat-progress-bar>
 
 <div *ngIf="entries && entries.content" fxLayout="column" fxFlexFill>
-  <mat-list flex-grow>
+  <mat-list>
     <ng-container *ngFor="let entry of entries.content; let i = index">
       <mat-divider *ngIf="i > 0"></mat-divider>
       <mat-list-item>
@@ -13,7 +13,9 @@
 
   <p *ngIf="entries.totalElements == 0">{{'entries.nothing' | i18n}}</p>
 
-  <div fxFlexOffset="auto">
+  <span fxFlexOffset="auto"></span>
+
+  <div>
     <mat-paginator *ngIf="entries.totalElements > 0" [pageSizeOptions]="pageSizeOptions" [pageIndex]="entries.number"
       [length]="entries.totalElements" [pageSize]="entries.size" (page)="update && update($event)" showFirstLastButtons>
     </mat-paginator>

src/app/ui/main/main.ui.html

@@ -36,21 +36,17 @@
       <a *ngIf="auth && auth.authenticated" (click)="logout()" mat-list-item>
         <mat-icon>exit_to_app</mat-icon> {{'logout' | i18n}}
       </a>
-      <a *ngIf="!auth || auth && !auth.authenticated" routerLink="/login" routerLinkActive="active" mat-list-item>
-        <mat-icon>login</mat-icon> {{'login' | i18n}}
-      </a>
     </mat-nav-list>
 
     <span class="spacer"></span>
 
-
     <mat-nav-list>
       <a *ngFor="let locale of locales" mat-list-item (click)="setLocale(locale)">
         <mat-icon *ngIf="locale == currentLocale">done</mat-icon>{{'locale.' + locale + '.long' |
         i18n}}
       </a>
-      <a mat-list-item>
-        <mat-slide-toggle (change)="darkThemeChange($event)" [checked]="darkTheme  == 'true'">
+      <a mat-list-item (click)="toggleDarkTheme()" >
+        <mat-slide-toggle [checked]="darkTheme">
           {{'darkTheme' | i18n}}
         </mat-slide-toggle>
       </a>
@@ -60,8 +56,6 @@
 
   <!-- Main content -->
   <mat-sidenav-content>
-    <div class="container">
-      <router-outlet></router-outlet>
-    </div>
+    <router-outlet></router-outlet>
   </mat-sidenav-content>
 </mat-sidenav-container>

src/app/ui/main/main.ui.ts

@@ -15,7 +15,7 @@ import { DateAdapter } from '@angular/material/core';
 
 export class UiMain {
   opened = true;
-  darkTheme = "false";
+  darkTheme: boolean = false;
   title = 'bstlboard';
   currentLocale: String;
   datetimeformat: String;
@@ -51,7 +51,7 @@ export class UiMain {
     }
 
     if (localStorage.getItem("bstlboard.darkTheme") == "true") {
-      this.darkTheme = "true";
+      this.darkTheme = true;
       window.document.body.classList.add("dark-theme");
     }
   }
@@ -72,18 +72,14 @@ export class UiMain {
     }
   }
 
-  darkThemeChange($event) {
-    if ($event.checked) {
-      this.darkTheme = "true";
-    } else {
-      this.darkTheme = "false";
-    }
+  toggleDarkTheme() {
+    this.darkTheme = !this.darkTheme;
 
-    localStorage.setItem("bstlboard.darkTheme", this.darkTheme);
+    localStorage.setItem("bstlboard.darkTheme", this.darkTheme ? "true" : "false");
 
     if (this.auth && this.auth.authenticated) {
       this.userService.get().subscribe((user: any) => {
-        user.darkTheme = $event.checked;
+        user.darkTheme = this.darkTheme;
         this.userService.update(user).subscribe(() => {
           window.location.reload();
         })
@@ -95,6 +91,7 @@ export class UiMain {
   }
 
   logout() {
+    localStorage.removeItem("bstlboard.autologin");
     this.authService.logout().subscribe(data => {
       this.router.navigate([ "" ]).then(() => {
         window.location.reload();