some minor UI improvements

src/Ombi/ClientApp/src/app/app.component.html

@@ -170,7 +170,7 @@
 
 
 <div>
-    <app-my-nav [showNav]="showNav" [isAdmin]="isAdmin" [applicationName]="applicationName" [username]="username" (logoutClick)="logOut();" (themeChange)="onSetTheme($event)">
+    <app-my-nav id="main-container" [showNav]="showNav" [isAdmin]="isAdmin" [applicationName]="applicationName" [username]="username" (logoutClick)="logOut();" (themeChange)="onSetTheme($event)">
     </app-my-nav>
 
 

src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.scss

@@ -27,23 +27,28 @@
 }
 
 ::ng-deep .mat-card-image {
-    height:75%;
+    height: 75%;
-    object-fit:cover;
+    object-fit: cover;
-    display:block;
+    display: block;
 }
 
 .card-spacing {
-    height:100%;
+    height: 100%;
 }
 
 .mat-card-content h6 {
-    overflow:hidden;
+    overflow: hidden;
-    white-space:nowrap;
+    white-space: nowrap;
-    font-weight:500;
+    font-weight: 500;
-    font-size:1.1rem;
+    font-size: 1.1rem;
 }
 
 @media (min-width: 300px) {
+
+    .small-middle-container {
+        margin: inherit;
+    }
+
     .col-xl-2 {
         flex: 0 0 100%;
         max-width: 100%;
@@ -51,20 +56,20 @@
     }
 
     .btn-group {
-        width:100%;
+        width: 100%;
     }
 
     mat-button-base {
-        width:100%;
+        width: 100%;
     }
 
     .col {
         padding-right: 10px !important;
-        padding-left:10px !important;
+        padding-left: 10px !important;
     }
 
     .row {
-        margin-left:0px;
+        margin-left: 0px;
     }
 
     .small-padding {
@@ -74,28 +79,29 @@
     }
 
     ::ng-deep .mat-card-image {
-        height:85% !important;
+        height: 85% !important;
     }
 }
 
 @media (min-width: 600px) {
     .justify-content-md-center {
-    justify-content: center !important;
+        justify-content: center !important;
     }
-    .small-middle-container{
+
-        width:auto;
+    .small-middle-container {
+        width: auto;
     }
 
     .btn-group {
-        width:auto;
+        width: auto;
     }
 
     mat-button-base {
-        width:auto;
+        width: auto;
     }
 
     ::ng-deep .mat-card-image {
-        height:75% !important;
+        height: 75% !important;
     }
 }
 
@@ -106,32 +112,32 @@
         min-width: 50%;
     }
 
-    .col{
+    .col {
         padding-right: 15px !important;
         padding-left: 15px !important;
     }
 
-    .small-padding{
+    .small-padding {
         padding-left: 20px !important;
         padding-right: 20px !important;
-        height:auto;
+        height: auto;
     }
 
-    .row{
+    .row {
-        margin-left:0px;
+        margin-left: 0px;
     }
 
-    .small-middle-container{
+    .small-middle-container {
-        width:auto;
+        width: auto;
-        overflow:hidden;
+        overflow: hidden;
     }
 
     .btn-group {
-        width:auto;
+        width: auto;
     }
 
     mat-button-base {
-        width:auto;
+        width: auto;
     }
 }
 
@@ -166,6 +172,7 @@
         min-width: 16.66666667%;
     }
 }
+
 @media (min-width: 1900px) {
     .col-xl-2 {
         flex: 0 0 14.285713%;

src/Ombi/ClientApp/src/app/my-nav/my-nav.component.html

@@ -35,7 +35,7 @@
         <mat-icon aria-label="Side nav toggle icon">menu</mat-icon>
       </button>
 
-            <div class="col-md-10 offset-md-1 col-10">
+            <div class="col-md-10 offset-md-1 col-8">
                 <span class="middle justify-content-center align-items-center">
           <!-- Search Bar -->
           <div style="width: 50%;">

src/Ombi/ClientApp/src/app/my-nav/my-nav.component.scss

@@ -1,6 +1,8 @@
 @import "~styles/variables.scss";
 .sidenav-container {
     min-height: 100vh;
+    -webkit-overflow-scrolling:touch;
+    overflow:auto;
 }
 
 .sidenav {

src/Ombi/ClientApp/src/app/services/signlarnotification.service.ts

@@ -3,6 +3,7 @@ import { AuthService } from '../auth/auth.service';
 
 import { HubConnection } from '@aspnet/signalr';
 import * as signalR from '@aspnet/signalr';
+
 @Injectable()
 export class SignalRNotificationService {
 
@@ -28,12 +29,16 @@ export class SignalRNotificationService {
             this.Notification.emit(data);
         });
 
+        let retryCount = 0;
 
         this.hubConnection.start().then((data: any) => {
             console.log('Now connected');
         }).catch((error: any) => {
+            retryCount++;
             console.log('Could not connect ' + error);
-            setTimeout(() => this.initialize(), 3000);
+            if (retryCount <= 3) {
+                setTimeout(() => this.initialize(), 3000);
+            }
         });
     }
 

src/Ombi/ClientApp/src/styles/shared.scss

@@ -38,11 +38,19 @@
 html,
 body {
     min-height: 100vh;
-    overflow: auto;
+    overflow: hidden;
     scrollbar-color: #616161 #303030; //firefox
     scrollbar-width: thin; //firefox
+    -webkit-overflow-scrolling: touch;
+}
+#main-container {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    overflow: auto;
 }
-
 .spinner-container {
     position: relative;
     margin-left: 50%;