catman/yt-mls
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Switched from flask-bootstrap to standalone Bootstrap 5 and overhaul of UI

Browse Source
This commit is contained in:
Maximilian Wagner
2023-08-03 16:57:57 +02:00
parent d1489c134b
commit 0f2b607e88
55 changed files with 59032 additions and 134 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
templates/base.html
View File

@@ -1,22 +1,48 @@
{%- extends "bootstrap/base.html" %}
{% import "bootstrap/utils.html" as utils %}
<!DOCTYPE html>
<head>
{% block title %}
ytm-ls
<title>ytm-ls</title>
{% endblock %}
{% block navbar %}
{{ nav.frontend_top.render() }}
{% block head %}
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="/static/bootstrap5/css/bootstrap.min.css" rel="stylesheet">
<script src="/static/bootstrap5/js/bootstrap.min.js"></script>
{% endblock %}
</head>
<body>
{% block body %}
<nav class="navbar navbar-expand-md navbar-light bg-light">
<div class="container-fluid">
<a class="navbar-brand" href="/">yt-mls</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto">
<li class="nav-item">
<a class="nav-link" href="/downloader">downloader</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/library">library</a>
</li>
</ul>
</div>
</div>
</nav>
{% endblock %}
{% block content %}
{%- with messages = get_flashed_messages(with_categories=True) %}
{%- if messages %}
<div class="row">
<div class="col-md-12">
{{utils.flashed_messages(messages)}}
{% if messages %}
{% for category, message in messages %}
<div class="container d-flex justify-content-center" style="width: fit-content; padding: 1%">
<div class="alert alert-{{ category }} d-flex align-self-center justify-content-center" style="width: 150%" role="alert">{{ message }}</div>
</div>
</div>
{%- endif %}
{% endfor %}
{% endif %}
{%- endwith %}
{% endblock %}
{% endblock %}
</body>