Global loading indicator
This commit is contained in:
@@ -71,6 +71,7 @@ def logout():
|
||||
@app.route("/auth/login", methods=['GET', 'POST'])
|
||||
def login():
|
||||
sessioninfo = get_session(request)
|
||||
time.sleep(3)
|
||||
|
||||
if sessioninfo:
|
||||
uid = sessioninfo[0]
|
||||
|
||||
@@ -34,6 +34,20 @@ hr {
|
||||
.entry img {
|
||||
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 {
|
||||
display: flex;
|
||||
flex-direction: column; }
|
||||
|
||||
+17
-16
@@ -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-family: 'avenir';
|
||||
// // 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 {
|
||||
// border: 1px solid black;
|
||||
// padding: 15px 15px;
|
||||
|
||||
+1
-1
@@ -1,5 +1,5 @@
|
||||
$(() => {
|
||||
$('#auth-visible').hide()
|
||||
// $('#auth-visible').hide()
|
||||
|
||||
|
||||
// Startdatum festlegen (Beispiel: 1. Januar 2025, 00:00:00 Uhr)
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<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="password" name="pass" placeholder="Passphrase"><br>
|
||||
<label>Automatisch abmelden in:</label>
|
||||
|
||||
@@ -27,12 +27,12 @@
|
||||
</head>
|
||||
<body>
|
||||
<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>
|
||||
<span>Verbuggte scheise hier. Komm hack mich doch, trau dich!</span>
|
||||
<div id="uptime-counter"></div>
|
||||
|
||||
<div id="main-frame" hx-indicator="loading">
|
||||
<div id="main-frame" hx-indicator="#loading">
|
||||
{% block content %}{% endblock %}
|
||||
</div>
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user