guide and calculator as dropwdown list fixes #203

This commit is contained in:
Luis Aleixo 2021-10-15 15:32:44 +02:00
parent b3b3fcde5d
commit 34ab697284
3 changed files with 23 additions and 7 deletions

View file

@ -436,10 +436,6 @@ v{{ calculator_version }} <span style="float:right; font-weight:bold">Please sen
</section>
<div class="center">
<button class="btn btn-primary bigButton">
<a href="{{ calculator_prefix }}/user-guide" class="{{ "nav-link active" if "user-guide" in active_page else "nav-link" }}">User guide</a>
</button>
&nbsp;&nbsp;
<button type='submit' class="btn btn-primary bigButton" id="generate_report">
Generate report
</button>

View file

@ -35,6 +35,11 @@ body {
font-size: 1.1rem;
}
.dropwown-navbar-colors {
background: rgb(42, 52, 66);
border-color: rgb(42, 52, 66);
}
/*============= NAVIGATION =============*/
.navbar-brand img {
@ -195,6 +200,13 @@ footer img {
.logo {
float: left;
}
.navbar .nav-item .dropdown-menu{ display: none; }
.navbar .nav-item:hover .dropdown-menu{ display: block; }
.navbar .nav-item .dropdown-menu{ margin-top:0; }
}
/* Devices under 768px (md) */
/* @media (max-width: 767.98px) {

View file

@ -37,10 +37,18 @@
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-link"><a href="/" class="{{ "nav-link active" if "home/" == active_page else "nav-link" }}">HOME</a></li>
<li class="nav-link"><a href="{{ calculator_prefix }}" class="{{ "nav-link active" if "calculator/" == active_page else "nav-link" }}">COVID CALCULATOR</a></li>
<li class="nav-link"><a href="/expert-app" class="{{ "nav-link active" if "/expert-app" == active_page else "nav-link" }}">EXPERT APP (BETA)</a></li>
<li class="nav-item dropdown pt-2 pl-0">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
COVID CALCULATOR
</a>
<div class="dropdown-menu dropwown-navbar-colors" aria-labelledby="navbarDropdown">
<a href="{{ calculator_prefix }}" class="{{ "nav-link active" if "calculator/" == active_page else "nav-link" }}">COVID CALCULATOR</a>
<a href="{{ calculator_prefix }}/user-guide" class="{{ "nav-link active" if "user-guide" in active_page else "nav-link" }}">USER GUIDE</a>
</div>
</li>
<li class="nav-link"><a href="https://hse.cern/covid-19-information" class="nav-link">COVID INFORMATION</a></li>
<li class="nav-link"><a href="/about" class="{{ "active" if "about" == active_page else "nav-link" }}">ABOUT</a></li>
<li class="nav-link"><a href="/expert-app" class="{{ "nav-link active" if "/expert-app" == active_page else "nav-link" }}">EXPERT APP (BETA)</a></li>
<li class="nav-link"><a href="/about" class="{{ "nav-link active" if "about" == active_page else "nav-link" }}">ABOUT</a></li>
</ul>
</div>
</div>