changed frontend design

Also added some notes
This commit is contained in:
2025-06-21 00:29:41 +02:00
parent c26a19ec7b
commit df199cf9a5
3 changed files with 133 additions and 55 deletions

View File

@@ -1,14 +1,6 @@
<!DOCTYPE html>
<html lang="en">
<head>
<script>
const reloadState = "<%= reload %>";
if (reloadState === "true") {
window.location.href = "/";
}
</script>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Login Page</title>
@@ -19,43 +11,49 @@
crossorigin="anonymous"
/>
</head>
<body>
<div class="container">
<div class="row">
<h1>Login page</h1>
</div>
<div class="row">
<form action="/login" method="post">
<div class="input-group">
<input
type="text"
name="username"
placeholder="Username"
class="form-control"
required
/>
<input
type="password"
name="password"
placeholder="Password"
class="form-control"
required
/>
<input
type="submit"
value="Login"
class="btn btn-primary"
onsubmit="this.form.submit()"
/>
</div>
</form>
</div>
<body class="bg-dark">
<div class="container d-flex justify-content-center align-items-center" style="min-height: 100vh;">
<div class="card shadow-lg" style="width: 100%; max-width: 400px;">
<div class="card-body">
<h2 class="card-title text-center mb-4">Login</h2>
<div class="alert alert-danger alter-dismissable fade show" role="alert">
<%= error %>
<button class="btn-close" aria-label="close" data-bs-dismiss="alert"></button>
<% if (error) { %>
<div class="alert alert-danger text-center" role="alert">
<%= error %>
</div>
<% } %>
<form action="/login" method="post">
<div class="mb-3">
<label for="username" class="form-label">Username</label>
<input
type="text"
class="form-control"
id="username"
name="username"
placeholder="Enter username"
required
/>
</div>
<div class="mb-3">
<label for="password" class="form-label">Password</label>
<input
type="password"
class="form-control"
id="password"
name="password"
placeholder="Enter password"
required
/>
</div>
<div class="d-grid">
<button type="submit" class="btn btn-primary">Login</button>
</div>
</form>
</div>
</div>
</div>
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/js/bootstrap.bundle.min.js"
integrity="sha384-ndDqU0Gzau9qJ1lfW4pNLlhNTkCfHzAVBReH9diLvGRem5+R9g2FzA8ZGN954O5Q"
@@ -63,3 +61,4 @@
></script>
</body>
</html>