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.
This commit is contained in:
2026-02-12 10:29:54 +01:00
parent d29473d3b1
commit c4f4340642
2 changed files with 12 additions and 3 deletions

View File

@@ -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"

View File

@@ -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;