mobile layout enhancements

src/app/app.component.html

@@ -82,6 +82,7 @@
 <div [ngClass]="theme" class="container">
   <div class="main">
     <router-outlet></router-outlet>
+    <div class="mobile-buffer">&nbsp;</div>
   </div>
 </div>
 <footer>

src/app/app.component.scss

@@ -168,8 +168,9 @@ footer {
     width: 100%;
 }
 
-[class*='dark-theme'] {
-    
+.mobile-buffer {
+    line-height: 50px;
+    display: none;
 }
 
 /** Mobile styles */
@@ -186,6 +187,10 @@ footer {
     .toolbar-item .notif-count {
         right: 35%;
     }
+
+    .mobile-buffer {
+        display: block;
+    }
 }
 
 @media screen and (pointer: none), (pointer: coarse) and (orientation: landscape) {