Create body container so scrollbar is beneath navbar

This commit is contained in:
Jonathan Wong 2015-08-26 16:23:54 -07:00
commit d627e0efdb
2 changed files with 31 additions and 4 deletions

View file

@ -1,4 +1,4 @@
<% <%
import plexpy import plexpy
from plexpy import version from plexpy import version
%> %>
@ -52,7 +52,7 @@ from plexpy import version
<span class="icon-bar"></span> <span class="icon-bar"></span>
</button> </button>
<a class="navbar-brand" href="home"> <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> </a>
</div> </div>
<div class="collapse navbar-collapse navbar-right" id="navbar-collapse-1"> <div class="collapse navbar-collapse navbar-right" id="navbar-collapse-1">
@ -99,7 +99,9 @@ from plexpy import version
</div> </div>
${next.headerIncludes()} ${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/jquery-2.1.4.min.js"></script>
<script src="interfaces/default/js/bootstrap3/bootstrap.min.js"></script> <script src="interfaces/default/js/bootstrap3/bootstrap.min.js"></script>

View file

@ -39,6 +39,9 @@ img {
} }
.navbar { .navbar {
background: #000; 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 { .navbar-brand {
padding: 5px 5px; padding: 5px 5px;
@ -1824,7 +1827,29 @@ a .home-platforms-instance-box:hover {
position: relative; position: relative;
margin-right: 3px; margin-right: 3px;
} }
#updatebar a:hover { #updatebar a:hover {
color: #F9AA03; 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;
} }