From 6a426f6902bfbab9ebe62d97556a434337aef8b7 Mon Sep 17 00:00:00 2001 From: Fabian Schieder Date: Thu, 22 Jan 2026 22:05:37 +0100 Subject: [PATCH] improvements --- assets/css/login.css | 155 +++++++++++++++++++++++++++++++++++++++++++ login.php | 1 + 2 files changed, 156 insertions(+) diff --git a/assets/css/login.css b/assets/css/login.css index e69de29..8391e27 100644 --- a/assets/css/login.css +++ b/assets/css/login.css @@ -0,0 +1,155 @@ +/* Datei: assets/css/login.css */ + +:root{ + --bg1:#0b1220; + --bg2:#0f172a; + --card:rgba(255,255,255,.06); + --border:rgba(255,255,255,.10); + --text:#e5e7eb; + --muted:#9ca3af; + --accent:#22c55e; + --accent2:#38bdf8; + --danger:#ef4444; + --shadow:0 18px 60px rgba(0,0,0,.45); + --radius:16px; +} + +*{ box-sizing:border-box; } +html,body{ height:100%; } + +body{ + margin:0; + font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,"Noto Sans","Helvetica Neue",sans-serif; + color:var(--text); + background: + radial-gradient(1100px 550px at 15% 10%, rgba(56,189,248,.22), transparent 60%), + radial-gradient(900px 500px at 85% 15%, rgba(34,197,94,.18), transparent 55%), + linear-gradient(180deg, var(--bg1), var(--bg2)); + display:grid; + place-items:center; + padding:28px 16px; +} + +.login-shell{ + width:min(420px, 100%); +} + +.login-card{ + background:var(--card); + border:1px solid var(--border); + border-radius:var(--radius); + box-shadow:var(--shadow); + backdrop-filter: blur(10px); + padding:26px 22px; +} + +.login-title{ + margin:0 0 6px 0; + font-size:26px; + letter-spacing:.2px; +} + +.login-subtitle{ + margin:0 0 18px 0; + color:var(--muted); + font-size:14px; + line-height:1.35; +} + +.form-group{ + margin:0 0 14px 0; +} + +label{ + display:block; + font-size:13px; + color:var(--muted); + margin:0 0 6px 0; +} + +input[type="text"], +input[type="password"]{ + width:100%; + border:1px solid rgba(255,255,255,.14); + background:rgba(15,23,42,.55); + color:var(--text); + border-radius:12px; + padding:12px 12px; + outline:none; + transition: border-color .2s ease, box-shadow .2s ease, transform .06s ease; +} + +input[type="text"]::placeholder, +input[type="password"]::placeholder{ + color:rgba(229,231,235,.55); +} + +input[type="text"]:focus, +input[type="password"]:focus{ + border-color: rgba(56,189,248,.55); + box-shadow: 0 0 0 4px rgba(56,189,248,.18); +} + +.actions{ + display:flex; + gap:10px; + margin-top:8px; +} + +button, +input[type="submit"]{ + width:100%; + border:0; + border-radius:12px; + padding:12px 14px; + font-weight:600; + cursor:pointer; + transition: transform .06s ease, filter .2s ease, box-shadow .2s ease; + background: linear-gradient(135deg, var(--accent2), var(--accent)); + color:#071018; + box-shadow: 0 12px 30px rgba(34,197,94,.18); +} + +button:hover, +input[type="submit"]:hover{ + filter: brightness(1.02); +} + +button:active, +input[type="submit"]:active{ + transform: translateY(1px); +} + +.login-error{ + border:1px solid rgba(239,68,68,.35); + background:rgba(239,68,68,.10); + color:#fecaca; + padding:10px 12px; + border-radius:12px; + margin:0 0 14px 0; + font-size:14px; +} + +.login-footer{ + margin-top:14px; + text-align:center; + color:var(--muted); + font-size:14px; +} + +.login-footer a{ + color:rgba(56,189,248,.95); + text-decoration:none; +} + +.login-footer a:hover{ + text-decoration:underline; +} + +/* Optional: dunkle HR */ +.hr{ + border:0; + height:1px; + background:rgba(255,255,255,.10); + margin:16px 0; +} \ No newline at end of file diff --git a/login.php b/login.php index 3d4388e..36b0266 100644 --- a/login.php +++ b/login.php @@ -60,6 +60,7 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') { +

Geizhals Login