ben/brouter-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

Move dropdown to left to not hide route/map center; footer padding (#66)

Browse source
This commit is contained in:
Norbert Renner 2018-04-11 22:26:26 +02:00
parent 82b632849c
commit 332fdffa77
3 changed files with 24 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

16
css/style.css
View file

@ -38,6 +38,16 @@ table.dataTable {
flex: auto;
}
.navbar {
/* align with leaflet-control */
padding: .5rem 10px;
}
.navbar-brand {
float: right;
margin-left: 1rem;
margin-right: 0;
}
footer {
flex: none;
@ -75,12 +85,6 @@ footer {
margin-bottom: 0
}
.bootstrap-select.btn-group:not(.input-group-btn),
.bootstrap-select.btn-group[class*="col-"] {
margin-left: 10px;
}
.axis path,
.axis line {
stroke: #818a91;

22
index.html
View file

@ -21,17 +21,7 @@
</div>
<div class="collapse navbar-toggleable-sm" id="collapsingNavbar">
<div class="nav navbar-nav">
<div class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
<span class="fa fa-lg fa-cloud-download"></span>&nbsp;Download</a>
<div class="dropdown-menu">
<a class="dropdown-item" id="dl-gpx" href="#" disabled>GPX</a>
<a class="dropdown-item" id="dl-kml" href="#" disabled>KML</a>
<a class="dropdown-item" id="dl-geojson" href="#" disabled>GeoJSON</a>
<a class="dropdown-item" id="dl-csv" href="#" disabled>data CSV</a>
</div>
</div>
<form class="navbar-form">
<form class="nav-item form-inline">
<div class="form-group">
<select class="selectpicker show-tick" id="profile-alternative" multiple>
<optgroup label="Profile" data-max-options="1" data-icon="fa-bicycle" id="profile">
@ -46,6 +36,16 @@
</select>
</div>
</form>
<div class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
<span class="fa fa-lg fa-cloud-download"></span>&nbsp;Download</a>
<div class="dropdown-menu">
<a class="dropdown-item" id="dl-gpx" href="#" disabled>GPX</a>
<a class="dropdown-item" id="dl-kml" href="#" disabled>KML</a>
<a class="dropdown-item" id="dl-geojson" href="#" disabled>GeoJSON</a>
<a class="dropdown-item" id="dl-csv" href="#" disabled>data CSV</a>
</div>
</div>
</div>
</div>
</nav>

4
js/index.js
View file

@ -41,7 +41,9 @@
// By default bootstrap-select use glyphicons
$('.selectpicker').selectpicker({
iconBase: 'fa',
tickIcon: 'fa-check'
tickIcon: 'fa-check',
// don't overlap with footer
windowPadding: [0, 0, 40, 0]
});
search = new BR.Search();