diff options
| author | Jocelyn Delalande <jocelyn@crapouillou.net> | 2017-02-02 11:48:40 +0100 |
|---|---|---|
| committer | Jocelyn Delalande <jocelyn@crapouillou.net> | 2017-02-04 00:41:28 +0100 |
| commit | c6c5f8657e3935da98c537fe75ab2eefe8751b6c (patch) | |
| tree | 606d474de1d77cd1589603c2ce562ea74228a4c9 /budget/templates | |
| parent | e148d19e9640a4bf3ebea8010db82c6f24fffc9a (diff) | |
| download | ihatemoney-mirror-c6c5f8657e3935da98c537fe75ab2eefe8751b6c.zip ihatemoney-mirror-c6c5f8657e3935da98c537fe75ab2eefe8751b6c.tar.gz ihatemoney-mirror-c6c5f8657e3935da98c537fe75ab2eefe8751b6c.tar.bz2 | |
Adapt navigation bar to bootstrap 4
Also fixed some weird alignment issues.
I think this will need more work later (revamp the navbar layout to avoid that
sensation of thing which are floating at random places in the navbar).
Diffstat (limited to 'budget/templates')
| -rw-r--r-- | budget/templates/layout.html | 39 |
1 files changed, 17 insertions, 22 deletions
diff --git a/budget/templates/layout.html b/budget/templates/layout.html index e9adb30..50f3019 100644 --- a/budget/templates/layout.html +++ b/budget/templates/layout.html @@ -14,7 +14,7 @@ <script type="text/javascript" charset="utf-8"> $(document).ready(function(){ var left = window.innerWidth/2-$('.flash').width()/2; - $(".flash").css({ "left": left+"px", "top":"45px" }); + $(".flash").css({ "left": left+"px", "top":"0.6rem" }); setTimeout(function(){ $(".flash").fadeOut("slow", function () { $(".flash").remove(); @@ -36,42 +36,37 @@ </head> <body> -<div class="navbar navbar-fixed-top"> - <div class="navbar-inner"> - <div class="container-fluid"> - <h1><a class="brand" href="{{ url_for(".home") }}">#! money?</a></h1> + <nav class="navbar navbar-toggleable-md navbar fixed-top navbar-inverse bg-inverse"> + <h1 class="col-2"><a class="navbar-brand" href="{{ url_for(".home") }}">#! money?</a></h1> + <ul class="navbar-nav col-5 offset-md-1"> {% if g.project %} - <ul class="nav primary-nav"> {% block navbar %} <li class="nav-item{% if current_view == 'list_bills' %} active{% endif %}"><a class="nav-link" href="{{ url_for(".list_bills") }}">{{ _("Bills") }}</a></li> <li class="nav-item{% if current_view == 'settle_bill' %} active{% endif %}"><a class="nav-link" href="{{ url_for(".settle_bill") }}">{{ _("Settle") }}</a></li> {% endblock %} - </ul> {% endif %} - <ul class="nav pull-right secondary-nav"> + </ul> + <ul class="navbar-nav secondary-nav col-4"> {% if g.project %} - <li class="dropdown"> - <a href="#" class="dropdown-toggle" data-toggle="dropdown"><strong>{{ g.project.name }}</strong> {{ _("options") }} <b class="caret"></b></a> - <ul class="dropdown-menu"> - <li><a href="{{ url_for(".edit_project") }}">{{ _("Project settings") }}</a></li> - <li class="divider"></li> + <li class="nav-item dropdown"> + <a href="#" class="nav-link dropdown-toggle" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><strong>{{ g.project.name }}</strong> {{ _("options") }} <b class="caret"></b></a> + <ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink"> + <li><a class="dropdown-item" href="{{ url_for(".edit_project") }}">{{ _("Project settings") }}</a></li> + <li class="dropdown-divider"></li> {% for id, name in session['projects'] %} {% if id != g.project.id %} - <li><a href="{{ url_for(".list_bills", project_id=id) }}">{{ _("switch to") }} {{ name }}</a></li> + <li><a class="dropdown-item" href="{{ url_for(".list_bills", project_id=id) }}">{{ _("switch to") }} {{ name }}</a></li> {% endif %} {% endfor %} - <li><a href="{{ url_for(".create_project") }}">{{ _("Start a new project") }}</a></li> - <li class="divider"></li> - <li><a href="{{ url_for(".exit") }}">{{ _("Logout") }}</a></li> + <li><a class="dropdown-item" href="{{ url_for(".create_project") }}">{{ _("Start a new project") }}</a></li> + <li class="dropdown-divider"></li> + <li><a class="dropdown-item" href="{{ url_for(".exit") }}">{{ _("Logout") }}</a></li> </ul> </li> {% endif %} - <li{% if g.lang == "fr" %} class="active"{% endif %}><a href="{{ url_for(".change_lang", lang="fr") }}">fr</a></li> - <li{% if g.lang == "en" %} class="active"{% endif %}><a href="{{ url_for(".change_lang", lang="en") }}">en</a></li> + <li class="nav-item{% if g.lang == "fr" %} active{% endif %}"><a class="nav-link" href="{{ url_for(".change_lang", lang="fr") }}">fr</a></li> + <li class="nav-item{% if g.lang == "en" %} active{% endif %}"><a class="nav-link" href="{{ url_for(".change_lang", lang="en") }}">en</a></li> </ul> - </div> - </div> -</div> </nav> |