labelbase/templates/_base.html
Xavier Fiechter cdc23acb6a .
2023-02-04 18:53:01 +01:00

334 lines
8.9 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{% load i18n %}
<!DOCTYPE html>
<html>
<head>
<title>{% block title %}{% endblock %}</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
<!--link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.2.0/css/bootstrap.min.css" rel="stylesheet"-->
<link href="https://cdn.datatables.net/1.13.1/css/dataTables.bootstrap5.min.css" rel="stylesheet">
{% block extra_media %}{% endblock %}
<style>
/* dashboard */
body {
font-size: .875rem;
}
.feather {
width: 16px;
height: 16px;
}
/*
* Sidebar
*/
.sidebar {
position: fixed;
top: 0;
/* rtl:raw:
right: 0;
*/
bottom: 0;
/* rtl:remove */
left: 0;
z-index: 100; /* Behind the navbar */
padding: 48px 0 0; /* Height of navbar */
box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
}
@media (max-width: 767.98px) {
.sidebar {
top: 5rem;
}
}
.sidebar-sticky {
height: calc(100vh - 48px);
overflow-x: hidden;
overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
}
.sidebar .nav-link {
font-weight: 500;
color: #333;
}
.sidebar .nav-link .feather {
margin-right: 4px;
color: #727272;
}
.sidebar .nav-link.active {
color: #2470dc;
}
.sidebar .nav-link:hover .feather,
.sidebar .nav-link.active .feather {
color: inherit;
}
.sidebar-heading {
font-size: .75rem;
}
/*
* Navbar
*/
.navbar-brand {
padding-top: .75rem;
padding-bottom: .75rem;
background-color: rgba(0, 0, 0, .25);
box-shadow: inset -1px 0 0 rgba(0, 0, 0, .25);
}
.navbar .navbar-toggler {
top: .25rem;
right: 1rem;
}
.navbar .form-control {
padding: .75rem 1rem;
}
.form-control-dark {
color: #fff;
background-color: rgba(255, 255, 255, .1);
border-color: rgba(255, 255, 255, .1);
}
.form-control-dark:focus {
border-color: transparent;
box-shadow: 0 0 0 3px rgba(255, 255, 255, .25);
}
/* end dashboard */
.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
@media (min-width: 768px) {
.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}
.b-example-divider {
height: 3rem;
background-color: rgba(0, 0, 0, .1);
border: solid rgba(0, 0, 0, .15);
border-width: 1px 0;
box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
}
.b-example-vr {
flex-shrink: 0;
width: 1.5rem;
height: 100vh;
}
.bi {
vertical-align: -.125em;
fill: currentColor;
}
.nav-scroller {
position: relative;
z-index: 2;
height: 2.75rem;
overflow-y: hidden;
}
.nav-scroller .nav {
display: flex;
flex-wrap: nowrap;
padding-bottom: 1rem;
margin-top: -1px;
overflow-x: auto;
text-align: center;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
}
</style>
</head>
<body>
{% block content_wrapper %}
<header class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0 shadow">
<a class="navbar-brand col-md-3 col-lg-2 me-0 px-3 fs-6" href="{% url 'home' %}"
style="font-weight:800;">L<span style="height:1.12em; width:1.25em" data-feather="tag" class="align-text-bottom"></span>BELBASE
</a>
<button class="navbar-toggler position-absolute d-md-none collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#sidebarMenu" aria-controls="sidebarMenu" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-nav">
<div class="nav-item text-nowrap">
</div>
</div>
</header>
<div class="container-fluid">
<div class="row">
<nav id="sidebarMenu" class="col-md-3 col-lg-2 d-md-block bg-light sidebar collapse">
<div class="position-sticky pt-3 sidebar-sticky">
{% if user.is_authenticated %}
<h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted text-uppercase">
<span>Wallets / Labelbases</span>
<a class="link-secondary" data-bs-toggle="modal" data-bs-target="#addLabelbaseModal" href="#" aria-label="Add a new wallet">
<span data-feather="plus-circle" class="align-text-bottom"></span>
</a>
</h6>
{% endif %}
<ul class="nav flex-column mb-2">
{% if user.is_authenticated %}
{% for labelbase in user.profile.labelbases %}
<li class="nav-item">
<a class="nav-link" href="{{ labelbase.get_absolute_url }}">
<span data-feather="database" class="align-text-bottom"></span>
{% if labelbase.name %}{{ labelbase.name }}{% endif %} {% if  labelbase.fingerprint %}{{ labelbase.fingerprint }}{% endif %}
</a>
</li>
{% empty %}
<!-- empty, no labelbases -->
{% endfor %}
{% else %}
<li class="nav-item">
<a class="nav-link" href="">Login to get started.</a>
</li>
{% endif %}
</ul>
<!-- -->
<div class="fixed-bottom">
<h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted text-uppercase">
<span>Your account</span>
</h6>
<ul class="nav flex-column mb-2">
{% if user.is_authenticated %}
<li class="nav-item">
<a class="nav-link {% block nav_userprofile %}{% endblock %}" href="{% url 'userprofile' %}">{{ user }} {% if user.otp_device %}🔒{% endif %}</a>
</li>
<li class="nav-item {% block nav_profile %}{% endblock %}">
<a class="nav-link" href="{% url 'two_factor:profile' %}">{% trans "Account Security" %}</a></li>
<li class="nav-item ">
<a class="nav-link" href="/docs/">API Docs
</a><li>
<li>&nbsp;
</li>
<li class="nav-item">
<a class="nav-link" href="{% url 'logout' %}">{% trans "Logout" %}</a>
</li>
{% else %}
<li class="nav-item">
<a class="nav-link" href="">Login to get started.</a>
</li>
{% endif %}
</ul>
</div>
<!-- -->
</div>
</nav>
<main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
{% include "_messages.html" %}
{% block content %}{% endblock %}
</main>
</div>
</div>
{% if user.is_authenticated %}
<!-- modal -->
<div class="modal" tabindex="-1" id="addLabelbaseModal">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<form action=".{#% url 'addlabeltolabelbase' labelbase.id %#}" method="post">
{% csrf_token %}
<div class="modal-header">
<h5 class="modal-title">Add Wallet / Labelbase</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
{{ labelform.as_p }}
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Add Label</button>
</div>
</form>
</div>
</div>
</div>
{% endif %}
{% endblock %}
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons@4.28.0/dist/feather.min.js" integrity="sha384-uO3SXW5IuS1ZpFPKugNNWqTZRRglnUJK6UAZ/gxOX80nxEkN9NcGZTftn6RzhGWE" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js@2.9.4/dist/Chart.min.js" integrity="sha384-zNy6FEbO50N+Cg5wap8IKA4M/ZnLJgzc6w2NqACZaK0u0FXfOWRRJOnQtpZun8ha" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
<script src="https://cdn.datatables.net/1.13.1/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.13.1/js/dataTables.bootstrap5.min.js"></script>
<script type="text/javascript">
/* globals Chart:false, feather:false */
(() => {
'use strict'
feather.replace({ 'aria-hidden': 'true' })
})()
$(document).ready(function () {
$('#bip329labels').DataTable({
order: [[0, 'desc']],
});
});
</script>
<!--
https://datatables.net/examples/styling/bootstrap5.html
-->
</body>
</html>