bee-queue-ui
Version:
Front-end web interface for Bee Queue Job Manager
122 lines (100 loc) • 1.65 kB
CSS
/*
* Base structure
*/
/* Move down content because we have a fixed navbar that is 50px tall */
/*body {*/
/*padding-top: 50px;*/
/*}*/
/*
* Global add-ons
*/
body {
padding-top: 50px;
}
.sub-header {
padding-bottom: 10px;
border-bottom: 1px solid #eee;
}
/*
* Navbar
*/
.navbar {
display: block;
}
@media (min-width: 768px) {
.navbar {
display: none;
}
body {
padding-top: 0px;
}
}
/*
* Sidebar
*/
/* Hide for mobile, show later */
.sidebar {
display: none;
}
@media (min-width: 768px) {
.sidebar {
position: fixed;
top: 0px;
bottom: 0;
left: 0;
z-index: 1000;
display: block;
padding: 20px;
overflow-x: hidden;
overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
background-color: #ffff66;
border-right: 1px solid #eee;
}
}
/* Sidebar navigation */
.nav-sidebar {
margin-right: -21px; /* 20px padding + 1px border */
margin-bottom: 20px;
margin-left: -20px;
}
.nav-sidebar > li > a, .nav-sidebar > li > h2, .nav-sidebar > li > h3, h4 {
padding-right: 20px;
padding-left: 20px;
color: #0d0d0d;
}
.nav-sidebar > .active > a {
color: #ffffff;
background-color: #0d0d0d;
}
/*
* Main content
*/
.main {
padding: 20px;
}
@media (min-width: 768px) {
.main {
padding-right: 40px;
padding-left: 40px;
}
}
.main .page-header {
margin-top: 0;
}
/*
* Placeholder dashboard ideas
*/
.placeholders {
margin-bottom: 30px;
text-align: center;
}
.placeholders h4 {
margin-bottom: 0;
}
.placeholder {
margin-bottom: 20px;
}
.placeholder img {
display: inline-block;
border-radius: 50%;
}