Refactor d-inline-block, !important overrides hidden attribute

This commit is contained in:
Norbert Renner 2018-01-26 17:44:47 +01:00
parent 102e978581
commit 431c3e3f7f
2 changed files with 7 additions and 6 deletions

View file

@ -55,6 +55,7 @@ footer {
} }
#stats li { #stats li {
margin: 0 1rem; margin: 0 1rem;
display: inline-block;
} }
#elevation-chart { #elevation-chart {

View file

@ -201,27 +201,27 @@
<footer> <footer>
<div class="flexrow"> <div class="flexrow">
<ul id="stats"> <ul id="stats">
<li class="d-inline-block"> <li>
<div class="text-muted small hidden-sm-down">Profile</div> <div class="text-muted small hidden-sm-down">Profile</div>
<p class="stats-label" id="stat-profile">Profile</p> <p class="stats-label" id="stat-profile">Profile</p>
</li> </li>
<li class="d-inline-block"> <li>
<div class="text-muted small hidden-sm-down">Distance</div> <div class="text-muted small hidden-sm-down">Distance</div>
<p class="stats-label" id="distance">0 <abbr title="kilometer">km</abbr></p> <p class="stats-label" id="distance">0 <abbr title="kilometer">km</abbr></p>
</li> </li>
<li style="display: inline-block" hidden> <li hidden>
<div class="text-muted small hidden-sm-down">Travel time</div> <div class="text-muted small hidden-sm-down">Travel time</div>
<p class="stats-label" id="totaltime">0 <abbr title="minutes">min</abbr></p> <p class="stats-label" id="totaltime">0 <abbr title="minutes">min</abbr></p>
</li> </li>
<li style="display: inline-block" hidden> <li hidden>
<div class="text-muted small hidden-sm-down">Total Energy (per 100km)</div> <div class="text-muted small hidden-sm-down">Total Energy (per 100km)</div>
<p class="stats-label" id="totalenergy">0 (0)</p> <p class="stats-label" id="totalenergy">0 (0)</p>
</li> </li>
<li class="d-inline-block"> <li>
<div class="text-muted small hidden-sm-down">Ascend (Plain ascend)</div> <div class="text-muted small hidden-sm-down">Ascend (Plain ascend)</div>
<p class="stats-label" id="ascend">0 (0) <abbr title="meter">m</abbr></p> <p class="stats-label" id="ascend">0 (0) <abbr title="meter">m</abbr></p>
</li> </li>
<li class="d-inline-block"> <li>
<div class="text-muted small hidden-sm-down">Cost (Mean cost factor)</div> <div class="text-muted small hidden-sm-down">Cost (Mean cost factor)</div>
<p class="stats-label" id="cost">- (-)</p> <p class="stats-label" id="cost">- (-)</p>
</li> </li>