From f7b9c5accad02df55563e4a9842eafa173a9b41d Mon Sep 17 00:00:00 2001
From: Luca Hohmann <34301369+GilgusMaximus@users.noreply.github.com>
Date: Sat, 16 Jul 2022 11:30:38 +0200
Subject: [PATCH] Fix for banner and too far scrolling (#2399)

* Fix for banner and too far scrolling

* Update App.css
---
 src/renderer/App.css | 13 +++++++------
 src/renderer/App.vue | 36 ++++++++++++++++++++----------------
 2 files changed, 27 insertions(+), 22 deletions(-)

diff --git a/src/renderer/App.css b/src/renderer/App.css
index 11b789b3..f04531d2 100644
--- a/src/renderer/App.css
+++ b/src/renderer/App.css
@@ -7,6 +7,7 @@
   display: flex;
   flex-wrap: wrap;
   font-family: 'Roboto', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
+  height: 100%;
 }
 
 .routerView {
@@ -15,14 +16,13 @@
 }
 
 .banner {
-  margin: 16px auto 0 auto;
-  width: 90%;
+  width: 80%;
+  margin: 0 auto;
 }
 
 .flexBox {
-  margin: 0;
-  flex: 1 1 0%;
-  flex-direction: column;
+  margin-top: 60px;
+  display: block;
 }
 
 #changeLogText {
@@ -44,7 +44,8 @@
   }
 
   .banner {
-    width: 90%;
+    width: 80%;
+    margin-top: 60px;
   }
 
   .flexBox {
diff --git a/src/renderer/App.vue b/src/renderer/App.vue
index 56969317..85d2e18b 100644
--- a/src/renderer/App.vue
+++ b/src/renderer/App.vue
@@ -9,21 +9,25 @@
   >
     <top-nav ref="topNav" />
     <side-nav ref="sideNav" />
-
-    <ft-flex-box class="flexBox">
-      <ft-notification-banner
-        v-if="showUpdatesBanner"
-        class="banner"
-        :message="updateBannerMessage"
-        @click="handleUpdateBannerClick"
-      />
-      <ft-notification-banner
-        v-if="showBlogBanner"
-        class="banner"
-        :message="blogBannerMessage"
-        @click="handleNewBlogBannerClick"
-      />
-
+    <ft-flex-box
+      class="flexBox routerView"
+    >
+      <div
+        v-if="showUpdatesBanner || showBlogBanner"
+      >
+        <ft-notification-banner
+          v-if="showUpdatesBanner"
+          class="banner"
+          :message="updateBannerMessage"
+          @click="handleUpdateBannerClick"
+        />
+        <ft-notification-banner
+          v-if="showBlogBanner"
+          class="banner"
+          :message="blogBannerMessage"
+          @click="handleNewBlogBannerClick"
+        />
+      </div>
       <transition
         v-if="dataReady"
         mode="out-in"
@@ -34,7 +38,7 @@
           ref="router"
           class="routerView"
         />
-        <!-- </keep-alive> -->
+      <!-- </keep-alive> -->
       </transition>
     </ft-flex-box>