Merge branch 'feat/improve-login-page' into develop

judas_server/web/static/css/style.css

@@ -15,6 +15,7 @@
     --nord-aur2: #ebcb8b;
     --nord-aur3: #a3be8c;
     --nord-aur4: #b48ead;
+
 }
 
 * {
@@ -38,6 +39,16 @@ input {
     padding: 0.25rem;
 }
 
+a {
+    color: var(--nord-acc0);
+    text-decoration: none;
+    transition: 0.3s ease-in-out;
+}
+
+a:hover {
+    color: var(--nord-acc2);
+}
+
 #wrapper {
     display: flex;
     flex-direction: column;
@@ -54,9 +65,13 @@ header {
 }
 
 main {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
     padding: 1rem;
     background-color: var(--nord-bg1);
     flex-grow: 1;
+    text-align: center;
 }
 
 header a {
@@ -84,6 +99,20 @@ header a {
     text-align: center;
 }
 
+.error-container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    margin: 1rem;
+    padding: 1rem;
+    background-color: var(--nord-aur0);
+    color: var(--nord-fg0);
+    border: 6px solid var(--nord-aur1);
+    border-radius: 24px;
+}
+
+
 .center-table {
     margin: 0 auto;
     width: 100%;

judas_server/web/templates/index.html

@@ -17,12 +17,15 @@
             {% endif %}
         </header>
         <main class="center">
+            <div>
                 <p>Welcome to</p>
                 <h2 id="typing-text" style="font-size: 3rem;">judas</h2>
                 <p>a remote PC fleet management system</p>
-            <br>
+            </div>
+            <div>
                 <p style="color: #bf616a;"><strong>Notice:</strong> Please use this system responsibly and in accordance with all applicable laws and organizational policies.</p>
-            <p>Please log in to manage your remote PCs.</p>
+                <p>Please <a href="{{ url_for('login')}}">log in</a> to manage your remote PCs.</p>
+            </div>
         </main>
     </div>
     <script>

judas_server/web/templates/login.html

@@ -11,12 +11,20 @@
         <header>
             <h1><a href="{{ url_for('index') }}">judas</a></h1>
         </header>
-        <main class="center">
+        <main>
-            <form method="post">
+            <h1>Login</h1>
+            <form method="post" class="center">
                 <label for="password">Password:</label>
                 <input type="password" id="password" name="password" required>
-                <br><br>
+                <br>
+                <br>
                 <input type="submit" value="Login" class="button">
+                {% if error %}
+                <div class="error-container">
+                    <h1>Login failure</h1>
+                    <p>{{ error }}</p>
+                </div>
+                {% endif %}
             </form>
         </main>
     </div>

judas_server/web/web_server.py

@@ -97,7 +97,10 @@ def login() -> str:
             flask_login.login_user(user)
             return flask.redirect(flask.url_for("panel"))
         else:
-            return "Invalid password", 401
+            return flask.render_template(
+                "login.html",
+                error="Invalid password. Please try again.",
+            )
     return flask.render_template("login.html")