Codice Menù Orizzontale
Struttura della pagina
<header>
{% include html_docs/header/topbar_base.html %}
{% include html_docs/header/header_menu-oriz.html %}
{% include esempi-lombardia/menu_orizzontale.html %}
</header>
<main>
{% include esempi-lombardia/filtri_tabella.html %}
{% include esempi-lombardia/tabella.html %}
{% include esempi-lombardia/paginazione.html %}
</main>
{% include html_docs/footer/footer_minimo.html %}
La struttura in questo caso è molto semplice:
Il tag <header> contienela barra istituzionale composta da:
- topbar
- header_menu-oriz
descritta più sotto. - il menu_orizzontale
Il tag <main> contiene semplicemente tutti gli elementi della parte centrale della pagina.
header_menu-oriz
<div class="it-header-center-wrapper it25-barra-ist">
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="it-header-center-content-wrapper">
<div class="it-brand-wrapper">
<div class="it25-hamburger-btn-wrapper">
<button
id="btn-hamburger"
class="custom-navbar-toggler btn btn-xs"
type="button"
aria-controls="nav1"
aria-expanded="false"
aria-label="Mostra/Nascondi la navigazione"
data-bs-toggle="navbarcollapsible"
data-bs-target="#nav1"
>
<svg class="icon icon-primary">
<use xlink:href="/bootstrap-lombardia/dist/svg/sprites.svg#it-burger"></use>
</svg>
</button>
</div>
<a href="#">
<img src="/bootstrap-lombardia/dist/assets/img/logo-rl.png"
alt="logo regione lombardia" class="it25-header-logo d-none d-md-block" />
<div class="it-brand-text">ACRONIMO Nome applicativo</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>