From c4f4340642ac649e8bd018b5bf42354333a0b7ee Mon Sep 17 00:00:00 2001
From: nessi <sascha@nesterovic.cc>
Date: Thu, 12 Feb 2026 10:29:54 +0100
Subject: [PATCH] Improve LoginPage styles and remove redundant labels

Removed unnecessary email and password labels to simplify the form. Adjusted spacing, padding, and font size for better visual alignment and added styles to enhance autofill appearance.
---
 frontend/src/pages/LoginPage.jsx |  2 --
 frontend/src/styles.css          | 13 ++++++++++++-
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/frontend/src/pages/LoginPage.jsx b/frontend/src/pages/LoginPage.jsx
index d079e31..8f1443e 100644
--- a/frontend/src/pages/LoginPage.jsx
+++ b/frontend/src/pages/LoginPage.jsx
@@ -38,7 +38,6 @@ export function LoginPage() {
         </section>
         <form className="card login-card" onSubmit={submit}>
           <h2>Login</h2>
-          <label>Email</label>
           <div className="input-shell">
             <input
               type="email"
@@ -48,7 +47,6 @@ export function LoginPage() {
               autoComplete="username"
             />
           </div>
-          <label>Passwort</label>
           <div className="input-shell">
             <input
               type="password"
diff --git a/frontend/src/styles.css b/frontend/src/styles.css
index bd1cc6f..c95dae1 100644
--- a/frontend/src/styles.css
+++ b/frontend/src/styles.css
@@ -222,7 +222,7 @@ td {
 .login-card {
   width: min(460px, 92vw);
   display: grid;
-  gap: 10px;
+  gap: 8px;
   border-color: #3559a3;
   backdrop-filter: blur(8px);
   animation: loginEnter 0.5s ease;
@@ -285,6 +285,8 @@ td {
   border: 0;
   outline: none;
   background: transparent;
+  padding: 9px 10px;
+  font-size: 15px;
 }
 
 .login-cta {
@@ -292,6 +294,7 @@ td {
   font-weight: 700;
   border-color: #3f74d6;
   background: linear-gradient(90deg, #1e74d6, #1b5ab6);
+  padding: 9px 12px;
 }
 
 .login-cta:hover {
@@ -299,6 +302,14 @@ td {
   filter: brightness(1.05);
 }
 
+.login-card input:-webkit-autofill,
+.login-card input:-webkit-autofill:hover,
+.login-card input:-webkit-autofill:focus {
+  -webkit-text-fill-color: #e5edf7;
+  -webkit-box-shadow: 0 0 0px 1000px #0e1731 inset;
+  transition: background-color 9999s ease-out 0s;
+}
+
 @keyframes focusPulse {
   0%, 100% {
     box-shadow: 0 0 0 3px #38bdf820, 0 0 14px #38bdf820;