irrlicht/Kontrollverlust
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Global loading indicator

Browse Source
This commit is contained in:
irrlicht
2025-12-15 15:42:03 +01:00
parent fef5119a03
commit 3b75ea33b9
6 changed files with 36 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
auth.py
+1
View File
@@ -71,6 +71,7 @@ def logout():
@app.route("/auth/login", methods=['GET', 'POST']) @app.route("/auth/login", methods=['GET', 'POST'])
def login(): def login():
sessioninfo = get_session(request) sessioninfo = get_session(request)
time.sleep(3)
if sessioninfo: if sessioninfo:
uid = sessioninfo[0] uid = sessioninfo[0]
static/css/main.css
+14
View File
@@ -34,6 +34,20 @@ hr {
.entry img { .entry img {
max-width: 100%; } max-width: 100%; }
#loading {
background-color: #fff9;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
flex-direction: column;
justify-content: center;
align-content: center;
transition: background-color 5s;
transition-timing-function: ease-in; }
form { form {
display: flex; display: flex;
flex-direction: column; } flex-direction: column; }
static/css/main.scss
+17 -16
View File
@@ -48,6 +48,23 @@ hr {
} }
} }
#loading {
// background-image: url('/static/spinner.gif');
background-color: #fff9;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
flex-direction: column;
justify-content: center;
align-content: center;
transition: background-color 5s;
transition-timing-function: ease-in;
}
// // @font-face { // // @font-face {
// // font-family: 'avenir'; // // font-family: 'avenir';
// // src: url('/static/avenir-font/AvenirLTStd-Medium.otf'); // // src: url('/static/avenir-font/AvenirLTStd-Medium.otf');
@@ -197,22 +214,6 @@ form {
// } // }
// } // }
// .loading {
// // background-image: url('/static/spinner.gif');
// background-color: #fffa;
// position: absolute;
// top: 0;
// left: 0;
// right: 0;
// bottom: 0;
// display: flex;
// flex-direction: column;
// justify-content: center;
// align-content: center;
// transition: background-color 5s;
// transition-timing-function: ease-in;
// }
// .post { // .post {
// border: 1px solid black; // border: 1px solid black;
// padding: 15px 15px; // padding: 15px 15px;
static/js/main.js
+1 -1
View File
@@ -1,5 +1,5 @@
$(() => { $(() => {
$('#auth-visible').hide() // $('#auth-visible').hide()
// Startdatum festlegen (Beispiel: 1. Januar 2025, 00:00:00 Uhr) // Startdatum festlegen (Beispiel: 1. Januar 2025, 00:00:00 Uhr)
templates/auth/login.html
+1 -1
View File
@@ -1,5 +1,5 @@
<h2>Einloggen</h2> <h2>Einloggen</h2>
<form hx-post="/auth/login" hx-target="#main-frame" > <form hx-post="/auth/login" hx-target="#main-frame">
<input type="text" name="user" placeholder="Nutzername" value="{{ username }}"><br> <input type="text" name="user" placeholder="Nutzername" value="{{ username }}"><br>
<input type="password" name="pass" placeholder="Passphrase"><br> <input type="password" name="pass" placeholder="Passphrase"><br>
<label>Automatisch abmelden in:</label> <label>Automatisch abmelden in:</label>
templates/baseof.html
+2 -2
View File
@@ -27,12 +27,12 @@
</head> </head>
<body> <body>
<div hx-get="/auth/headerbar" hx-trigger="load"></div> <div hx-get="/auth/headerbar" hx-trigger="load"></div>
<div class="htmx-indicator loading"></div> <div class="htmx-indicator" id="loading"></div>
<h1>Kontrollverlust</h1> <h1>Kontrollverlust</h1>
<span>Verbuggte scheise hier. Komm hack mich doch, trau dich!</span> <span>Verbuggte scheise hier. Komm hack mich doch, trau dich!</span>
<div id="uptime-counter"></div> <div id="uptime-counter"></div>
<div id="main-frame" hx-indicator="loading"> <div id="main-frame" hx-indicator="#loading">
{% block content %}{% endblock %} {% block content %}{% endblock %}
</div> </div>
</body> </body>