litvinovg/vivo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improve navbar

Browse source
This commit is contained in:
Graham Triggs 2017-10-01 21:22:23 +01:00
parent 72e4a51f65
commit f2a0e5d9cc
4 changed files with 65 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
webapp/src/main/webapp/themes/tenderfoot/css/navbar-breakpoint.css Normal file
View file

@ -0,0 +1,36 @@
@media (max-width: 1200px) {
.navbar-header {
float: none;
}
.navbar-left,.navbar-right {
float: none !important;
}
.navbar-toggle {
display: block;
}
.navbar-collapse {
border-top: 1px solid transparent;
box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
}
.navbar-fixed-top {
top: 0;
border-width: 0 0 1px;
}
.navbar-collapse.collapse {
display: none!important;
}
.navbar-nav {
float: none!important;
margin-top: 7.5px;
}
.navbar-nav>li {
float: none;
}
.navbar-nav>li>a {
padding-top: 10px;
padding-bottom: 10px;
}
.collapse.in{
display:block !important;
}
}

1
webapp/src/main/webapp/themes/tenderfoot/css/screen.css
View file

@ -21,6 +21,7 @@ VIVO tenderfoot theme: screen styles
@import url("reset.css");
@import url("tenderfoot.css");
@import url("edit.css");
@import url("navbar-breakpoint.css");
@import url("page-admin.css");
@import url("page-browse.css");
@import url("page-home.css");

20
webapp/src/main/webapp/themes/tenderfoot/css/tenderfoot.css
View file

@ -26,10 +26,30 @@ legend {
padding-left: 15px;
}
.navbar-toggle .button-label {
display: inline-block;
float: left;
font-weight: bold;
line-height: 14px;
padding-right: 10px;
}
.button-bars {
display: inline-block;
float: left;
}
p.navbar-text {
margin-left: 15px;
}
#nav-searchbox {
float: right;
}
button.navbar-toggle {
z-index: 999;
}
body {
padding: 0;
height: 100%; /* needed for container min-height */

8
webapp/src/main/webapp/themes/tenderfoot/templates/page/partials/menu.ftl
View file

@ -4,12 +4,13 @@
<div id="nav">
<div class="container">
<nav class="navbar navbar-default">
<p class="navbar-text visible-xs-inline-block">Menu</p>
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbarContent" aria-controls="navbarContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="sr-only">Toggle navigation</span>
<button class="navbar-toggle pull-left" type="button" data-toggle="collapse" data-target="#navbarContent" aria-controls="navbarContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="button-label">Menu</span>
<div class="button-bars">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</div>
</button>
<div class="collapse navbar-collapse" id="navbarContent">
<ul id="main-nav" role="list" class="nav navbar-nav mr-auto mt-2 mt-md-0">
@ -22,6 +23,7 @@
<#include "search.ftl">
</li>
</ul>
</div>
</nav>
</div>
</div>