From 2060eea09fdbc6111f510d292f14bf438e811616 Mon Sep 17 00:00:00 2001
From: Patrick Gebhardt <pjgebhardt@icloud.com>
Date: Thu, 25 Jun 2020 13:08:24 +0200
Subject: [PATCH] Add share button to side-nav

---
 frontend/src/app/app.component.html | 31 ++++++++++++++++-------------
 frontend/src/app/app.component.scss | 11 +++++++++-
 2 files changed, 27 insertions(+), 15 deletions(-)

diff --git a/frontend/src/app/app.component.html b/frontend/src/app/app.component.html
index afbc3a3..3f8791d 100644
--- a/frontend/src/app/app.component.html
+++ b/frontend/src/app/app.component.html
@@ -4,21 +4,24 @@
   </button>
   <img alt="Travopti logo" class="title" src="assets/logo.svg">
 </mat-toolbar>
-<mat-drawer-container autosize class="drawer">
+<mat-drawer-container autosize>
   <mat-drawer #drawer [mode]="isMobile?'over':'side'" [opened]="!isMobile">
-    <div class="side-nav">
-      <a (click)="isMobile&&drawer.close()" mat-button routerLink="home" routerLinkActive="active">
-        <mat-icon>home</mat-icon>
-        <span>Home</span>
-      </a>
-      <a (click)="isMobile&&drawer.close()" mat-button routerLink="bookmark" routerLinkActive="active">
-        <mat-icon>bookmark</mat-icon>
-        <span>Your bookmarks</span>
-      </a>
-      <a (click)="isMobile&&drawer.close()" mat-button routerLink="team" routerLinkActive="active">
-        <mat-icon>group</mat-icon>
-        <span>About us</span>
-      </a>
+    <div class="drawer">
+      <div class="side-nav">
+        <a (click)="isMobile&&drawer.close()" mat-button routerLink="home" routerLinkActive="active">
+          <mat-icon>home</mat-icon>
+          <span>Home</span>
+        </a>
+        <a (click)="isMobile&&drawer.close()" mat-button routerLink="bookmark" routerLinkActive="active">
+          <mat-icon>bookmark</mat-icon>
+          <span>Your bookmarks</span>
+        </a>
+        <a (click)="isMobile&&drawer.close()" mat-button routerLink="team" routerLinkActive="active">
+          <mat-icon>group</mat-icon>
+          <span>About us</span>
+        </a>
+      </div>
+      <a class="feedback" href="mailto:feedback@travopti.de">Feedback</a>
     </div>
   </mat-drawer>
   <mat-drawer-content class="content">
diff --git a/frontend/src/app/app.component.scss b/frontend/src/app/app.component.scss
index d871714..fc2a145 100644
--- a/frontend/src/app/app.component.scss
+++ b/frontend/src/app/app.component.scss
@@ -24,11 +24,14 @@
 
 .drawer {
   flex: 1 1 auto;
+  display: flex;
+  flex-direction: column;
+  height: 100%;
 
   .side-nav {
+    flex: 1 1 auto;
     display: flex;
     flex-direction: column;
-    height: 100%;
     min-width: 12.5vw;
     box-sizing: border-box;
     padding: 1rem 0;
@@ -50,6 +53,12 @@
       }
     }
   }
+
+  .feedback {
+    margin: 1rem;
+    text-align: center;
+    color: gray;
+  }
 }
 
 .content {