Commit 6799b488 authored by Andreas Valder's avatar Andreas Valder Committed by Andreas Valder
Browse files

redid navbar, it is now posible to use fa glyphs in the navbar, closes #32

parent 2f239edc
......@@ -54,11 +54,14 @@ def mod_required(func):
return decorator
app.jinja_env.globals['navbar'] = []
def register_navbar(name, icon=None):
# iconlib can be 'bootstrap'
# ( see: http://getbootstrap.com/components/#glyphicons )
# or 'fa'
# ( see: http://fontawesome.io/icons/ )
def register_navbar(name, iconlib='bootstrap', icon=None):
def wrapper(func):
endpoint = func.__name__
app.jinja_env.globals['navbar'].append((endpoint, name, icon,
not endpoint in mod_endpoints))
app.jinja_env.globals['navbar'].append((endpoint, name, iconlib, icon, not endpoint in mod_endpoints))
return func
return wrapper
......
......@@ -8,3 +8,10 @@
.table-top-aligned tr { vertical-align: top; }
.mejs-controls label { font-weight: normal; margin-bottom: 0px; }
.mejs-speed-selector { top: -130px !important; height: 130px !important; }
.footer {
position: fixed;
bottom: 0;
width: 100%;
height: 30px;
background-color: #f5f5f5;
}
......@@ -27,80 +27,70 @@
{% block navbar %}
<nav class="navbar navbar-default navbar-static-top">
<div class="container-fluid">
<div class="row">
<div class="col-xs-1 hidden-xs hidden-sm">
<a href="/"><img src="{{url_for('static', filename='logo.png')}}" style="width: 80px; padding: 5px"></a>
</div>
<div class="col-xs-12 col-md-11">
<div class="row">
<ul class="list-inline col-xs-12">
<li>
<a href="#">Vampir</a>
</li>
<li>
<a href="#">Youtube</a>
</li>
<li>
<a href="#">Fachschaft</a>
</li>
<li>
<a href="#">Facebook</a>
</li>
<li>
<a href="#">Twitter</a>
</li>
</ul>
</div>
<div class="row">
<div class="col-xs-12 col-sm-8">
<ul class="nav nav-pills">
{% for endpoint, caption, gly, visible in navbar %}
{% if visible or ismod() %}
<li{% if endpoint == request.endpoint %} class="active"{% endif %}>
<a href="{{ url_for(endpoint) }}">{% if gly != '' %}<span class="glyphicon glyphicon-{{ gly }}"></span> {% endif %}{{ caption }}</a>
</li>
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse"
data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/" style="padding: 3px;">
<img alt="Brand" src="{{url_for('static', filename='logo.png')}}" style="height: 100%;" >
</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav nav-pills" style="margin-top: 5px;">
{% for endpoint, caption, gly, iconlib, visible in navbar if visible or ismod() %}
<li{% if endpoint == request.endpoint %} class="active"{% endif %}>
<a href="{{ url_for(endpoint) }}">
{% if gly != '' %}
{% if iconlib == 'bootstrap' %}
<span aria-hidden="true" class="glyphicon glyphicon-{{ gly }}"></span>
{% elif iconlib == 'fa' %}
<span aria-hidden="true" class="fa fa-{{ gly }}"></span>
{% endif %}
{% endfor %}
<li class="navbar-right">
{% if not ismod() %}
<a id="loginpopover" data-container="body" data-toggle="popover" data-placement="bottom">
<span class="glyphicon glyphicon-log-in"></span>
</a>
<script>
$('#loginpopover').popover(
{
html:true,
title:'Login für Moderatoren',
content:'<form method="post" action="{{url_for('login', ref=request.url)}}"><input placeholder="User" name="user" type="text"><br><input placeholder="Password" name="password" type="password"><br><input type="submit" value="Login"></form>'
}
)
</script>
{% else %}
<a href="{{url_for('logout', ref=request.url)}}">
{{ session.user.givenName }}
<span class="glyphicon glyphicon-log-out"></span>
</a>
{% endif %}
</li>
</ul>
</div>
<div class="col-xs-12 col-sm-4">
<form action="{{ url_for('search') }}">
<div class="input-group">
<input class="form-control" type="text" name="q" placeholder="Search" value="{{ searchtext }}">
<span class="input-group-btn"><button class="btn btn-secondary" type="submit"><span class="glyphicon glyphicon-search"></span> </button></span>
</div>
</form>
</div>
</div>
<div class="row">
</div>
</div>
{{ caption }}
{% endif %}
</a>
</li>
{% endfor %}
<li class="col-xs-12 col-sm-4 pull-right">
<form action="{{ url_for('search') }}" role="search">
<div class="input-group">
<input class="form-control" type="text" name="q" placeholder="Search" value="{{ searchtext }}" width="100px">
<span class="input-group-btn"><button class="btn btn-secondary" type="submit"><span class="glyphicon glyphicon-search"></span> </button></span>
</div>
</form>
</li>
<li class="navbar-right">
{% if not ismod() %}
<a id="loginpopover" data-container="body" data-toggle="popover" data-placement="bottom">
<span class="glyphicon glyphicon-log-in"></span>
</a>
<script>
$('#loginpopover').popover(
{
html:true,
title:'Login für Moderatoren',
content:'<form method="post" action="{{url_for('login', ref=request.url)}}"><input placeholder="User" name="user" type="text"><br><input placeholder="Password" name="password" type="password"><br><input type="submit" value="Login"></form>'
}
)
</script>
{% else %}
<a href="{{url_for('logout', ref=request.url)}}">
{{ session.user.givenName }}
<span class="glyphicon glyphicon-log-out"></span>
</a>
{% endif %}
</li>
</ul>
</div>
</div>
</nav>
{% endblock %}
<div class="container-fluid">
<div class="container-fluid" style="margin-bottom: 30px;">
<div class="row">
{% if page_border == 0 %}
<div class="col-xs-12">
......@@ -133,5 +123,25 @@
</div>
</div>
</div>
<footer class="footer">
<div class="container-fluid">
<ul class="list-inline col-xs-12">
<li>
<a href="#">Vampir</a>
</li>
<li>
<a href="#">Youtube</a>
</li>
<li>
<a href="#">Fachschaft</a>
</li>
<li>
<a href="#">Facebook</a>
</li>
<li>
<a href="#">Twitter</a>
</li>
</div>
</footer>
</body>
</html>
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment