bdd9854c47
- Make menu responsive (hides on smaller screens, e,g, 1/2 laptop screen,
tablet, mobile)
- Add aria parameters for accessibility
- Show current focus when navigating (accessibility)
- Remove the blue outline when clicking links in Chrome
- Makes menu less hideous
Change-Id: I1cdfa079f0b371d1afddefa67d8a21e93abde9ee
Implements: blueprint navigation-improvements
Closes-Bug: 1315488
Closes-Bug: 1628274
(cherry picked from commit 837587fe73)
39 lines
1.3 KiB
HTML
39 lines
1.3 KiB
HTML
{% load i18n %}
|
|
|
|
{% spaceless %}
|
|
<nav class="navbar navbar-default navbar-fixed-top">
|
|
<div class="container-fluid">
|
|
<!-- Brand and toggle get grouped for better mobile display -->
|
|
<div class="navbar-header">
|
|
{% include "header/_brand.html" %}
|
|
|
|
<button id="sidebar-toggle" type="button" class="navbar-toggle pull-left">
|
|
<span class="sr-only">{% trans "Toggle navigation" %}</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
|
|
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse">
|
|
<span class="sr-only">{% trans "Toggle navigation" %}</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Collect the nav links, forms, and other content for toggling -->
|
|
<div class="collapse navbar-collapse" id="navbar-collapse">
|
|
<ul class="nav navbar-nav">
|
|
{% include "header/_context_selection.html" %}
|
|
</ul>
|
|
|
|
<ul class="nav navbar-nav navbar-right">
|
|
{% include "header/_user_menu.html" %}
|
|
{% include "header/_region_selection.html" %}
|
|
</ul>
|
|
</div><!-- /.navbar-collapse -->
|
|
</div><!-- /.container-fluid -->
|
|
</nav>
|
|
{% endspaceless %}
|