From d627e0efdbc060b7fb68082c167d73a0e4f37afd Mon Sep 17 00:00:00 2001
From: Jonathan Wong <Jonny.Wong.16@gmail.com>
Date: Wed, 26 Aug 2015 16:23:54 -0700
Subject: [PATCH] Create body container so scrollbar is beneath navbar

---
 data/interfaces/default/base.html      |  8 +++++---
 data/interfaces/default/css/plexpy.css | 27 +++++++++++++++++++++++++-
 2 files changed, 31 insertions(+), 4 deletions(-)

diff --git a/data/interfaces/default/base.html b/data/interfaces/default/base.html
index 3bffc64a..f0918641 100644
--- a/data/interfaces/default/base.html
+++ b/data/interfaces/default/base.html
@@ -1,4 +1,4 @@
-<%
+<%
 import plexpy
 from plexpy import version
 %>
@@ -52,7 +52,7 @@ from plexpy import version
                     <span class="icon-bar"></span>
                 </button>
                 <a class="navbar-brand" href="home">
-                    <img alt="PlexPy" src="interfaces/default/images/logo-plexpy@2x.png" height="40px">
+                    <img alt="PlexPy" src="interfaces/default/images/logo-plexpy@2x.png" height="40">
                 </a>
             </div>
             <div class="collapse navbar-collapse navbar-right" id="navbar-collapse-1">
@@ -99,7 +99,9 @@ from plexpy import version
 </div>
 
 ${next.headerIncludes()}
-${next.body()}
+<div class="body-container">
+    ${next.body()}
+</div>
 
 <script src="interfaces/default/js/jquery-2.1.4.min.js"></script>
 <script src="interfaces/default/js/bootstrap3/bootstrap.min.js"></script>
diff --git a/data/interfaces/default/css/plexpy.css b/data/interfaces/default/css/plexpy.css
index 587bee7b..f7936e13 100644
--- a/data/interfaces/default/css/plexpy.css
+++ b/data/interfaces/default/css/plexpy.css
@@ -39,6 +39,9 @@ img {
 }
 .navbar {
     background: #000;
+    -webkit-box-shadow: 0 0 0 3px rgba(0,0,0,.2);
+    -moz-box-shadow: 0 0 0 3px rgba(0,0,0,.2);
+    box-shadow: 0 0 0 3px rgba(0,0,0,.2);
 }
 .navbar-brand {
     padding: 5px 5px;
@@ -1824,7 +1827,29 @@ a .home-platforms-instance-box:hover {
     position: relative;
     margin-right: 3px;
 }
-
 #updatebar a:hover {
     color: #F9AA03;
+}
+.body-container {
+    position: absolute;
+    top: 50px;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    overflow-x: hidden;
+    overflow-y: auto;
+    
+}
+::-webkit-scrollbar {
+    width: 15px;
+}
+::-webkit-scrollbar-track {
+    background-color: rgba(0,0,0,.2);
+}
+::-webkit-scrollbar-thumb {
+    min-height: 50px;
+    background-color: rgba(255,255,255,.15);
+    border: 3px solid transparent;
+    border-radius: 8px;
+    background-clip: padding-box;
 }
\ No newline at end of file