Skip to content
Snippets Groups Projects
Commit e127e1e5 authored by Patrick Jentsch's avatar Patrick Jentsch
Browse files

Add navigation structure.

parent 05cbf1fe
Branches
Tags
No related merge requests found
Hide whitespace changes
Inline Side-by-side
app/static/css/opaque.css
+ 9
− 0
View file @ e127e1e5
body {
display: flex;
min-height: 100vh;
flex-direction: column;
}
main {
flex: 1 0 auto;
}
app/templates/base.html.j2
+ 11
− 2
View file @ e127e1e5
......@@ -11,12 +11,13 @@
<!-- import materialize icons css -->
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='fonts/material-design-icons-3.0.1/iconfont/material-icons.css') }}">
<!--Import materialize.css-->
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='css/materialize.min.css') }}" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='css/materialize.min.css') }}" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='css/opaque.css') }}" media="screen,projection"/>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
{% include 'sidenav.html.j2' %}
{% include 'navs.html.j2' %}
<main>
<div class="container">
......@@ -31,6 +32,14 @@
<script type="text/javascript" src="{{ url_for('static', filename='js/materialize.min.js') }}"></script>
<script>
M.AutoInit();
M.Dropdown.init(
document.getElementById("nav-account"),
{"constrainWidth": false, "coverTrigger": false}
);
M.Dropdown.init(
document.getElementById("nav-notifications"),
{"constrainWidth": false, "coverTrigger": false}
);
</script>
</body>
</html>
app/templates/navs.html.j2 0 → 100644
+ 53
− 0
View file @ e127e1e5
<nav class="blue-grey darken-2">
<ul class="left">
<li><a href="#" data-target="sidenav" class="sidenav-trigger show-on-large"><i class="material-icons">menu</i></a></li>
</ul>
<div class="nav-wrapper">
<a href="#" class="brand-logo center">
{% if title %}
{{ title }}
{% else %}
Opaque
{% endif %}
</a>
<ul class="right hide-on-med-and-down">
<li><a id="nav-notifications" class="dropdown-trigger" href="#!" data-target="nav-notifications-dropdown"><i class="material-icons">notifications</i></a></li>
<li><a id="nav-account" class="dropdown-trigger" href="#!" data-target="nav-account-dropdown"><i class="material-icons">account_circle</i></a></li>
</ul>
</div>
</nav>
<!-- sidenav -->
<ul id="sidenav" class="sidenav">
<li>
<img src="{{ url_for('static', filename='images/favicon.png') }}">
</li>
<li>
<a href="{{ url_for('index') }}"><i class="material-icons">cloud</i>Opaque</a>
</li>
<li class="no-padding">
<ul class="collapsible collapsible-accordion">
<li>
<a class="collapsible-header">Ausklappbar<i class="material-icons">arrow_drop_down</i></a>
<div class="collapsible-body">
<ul>
<li><a href="#!">1</a></li>
<li><a href="#!">2</a></li>
</ul>
</div>
</li>
</ul>
</li>
</ul>
<!-- dropdowns -->
<ul id="nav-account-dropdown" class="dropdown-content">
<li><a href="#!">Log In</a></li>
<li class="divider"></li>
<li><a href="#!">Register</a></li>
</ul>
<div id="nav-notifications-dropdown" class="dropdown-content teal">
<p>Notifications</p>
</div>
app/templates/sidenav.html.j2 deleted 100644 → 0
+ 0
− 15
View file @ 05cbf1fe
<ul id="slide-out" class="sidenav">
<li>
<div class="user-view">
<div class="background">
<img src="{{ url_for('static', filename='images/favicon.png') }}">
</div>
</div>
</li>
<li><a href="#!"><i class="material-icons">cloud</i>First Link With Icon</a></li>
<li><a href="#!">Second Link</a></li>
<li><div class="divider"></div></li>
<li><a class="subheader">Subheader</a></li>
<li><a class="waves-effect" href="#!">Third Link With Waves</a></li>
</ul>
<a href="#" data-target="slide-out" class="sidenav-trigger"><i class="material-icons">menu</i></a>
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment