2
0
mirror of https://github.com/jfmcbrayer/brutaldon synced 2024-12-23 13:49:48 +01:00
brutaldon-interfaccia-web-m.../brutaldon/templates/base.html
2018-05-27 13:43:20 -04:00

127 lines
4.2 KiB
HTML

{% load static %}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{% block title %}brutaldon{% endblock %}</title>
{% if not fullbrutalism %}
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.0/css/bulma.min.css">
<link rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/fork-awesome@1.0.11/css/fork-awesome.min.css"
integrity="sha256-MGU/JUq/40CFrfxjXb5pZjpoZmxiP2KuICN5ElLFNd8="
crossorigin="anonymous">
<link rel="stylesheet" href="{% static "css/brutaldon.css" %}">
{% else %}
<link rel="stylesheet" href="{% static "css/fullbrutalism.css" %}" >
{% endif %}
<link rel="icon" href="{% static "images/brutaldon.png" %}" type="image/png">
</head>
<body>
{% block navbar %}
<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="navbar-item" href="{% url "home" %}">
<img src="{% static "images/brutaldon.png" %}"
width="32" height="32" alt="Brutaldon">
</a>
</div>
<div class="navbar-menu is-active" id="navMenu">
<!-- navbar start, navbar end -->
<div class="navbar-start">
<a href="{% url "home" %}" class="navbar-item">Home</a>
<a class="navbar-item" href="{% url "note" %}">Notifications</a>
<a class="navbar-item" href="{% url "local" %}">Local</a>
<a class="navbar-item" href="{% url "fed" %}">Federated</a>
</div>
<div class="navbar-end" >
<a class="navbar-item" href="{% url "settings" %}">Settings</a>
<a class="navbar-item" href="{% url "logout" %}">Log out</a>
</div>
</div>
</nav>
{% endblock %}
<section class="section">
<div class="container">
{% block content %}
<h1 class="title">
Title
</h1>
<p class="subtitle">
Brutaldon is totally a thing.
</p>
{% endblock %}
</div>
</section>
{% if not fullbrutalism %}
<footer class="footer">
<div class="level">
<div class="level-left">
<a class="level-item is-size-7" href="{% url "about" %}">
About
</a>
</div>
<div class="level-right">
<a class="level-item is-size-7" href="{% url "privacy" %}">
Privacy
</a>
</div>
</div>
</footer>
<script type="application/javascript">
document.addEventListener('DOMContentLoaded', function () {
// Remove is-active from navbar menu
var menu = document.querySelector('#navMenu');
menu.classList.remove('is-active');
// Add the burger
var brand = document.querySelector('.navbar-brand');
var burger = document.createElement('a');
burger.classList.toggle('navbar-burger');
burger.setAttribute("aria-label", "menu");
burger.setAttribute("aria-expanded", "false");
burger.setAttribute("data-target", "navMenu");
for (var index = 0; index < 3; index++)
{
var span = document.createElement('span');
span.setAttribute('aria-hidden', "true");
burger.appendChild(span);
}
brand.appendChild(burger);
// Get all "navbar-burger" elements
var $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);
// Check if there are any navbar burgers
if ($navbarBurgers.length > 0) {
// Add a click event on each of them
$navbarBurgers.forEach(function ($el) {
$el.addEventListener('click', function () {
// Get the target from the "data-target" attribute
var target = $el.dataset.target;
var $target = document.getElementById(target);
// Toggle the class on both the "navbar-burger" and the "navbar-menu"
$el.classList.toggle('is-active');
$target.classList.toggle('is-active');
});
});
}
});
</script>
{% endif %}
</body>
</html>