feat(ui): responsive layout for mobile and wide screens

- Add explicit viewport meta (device-width) for proper mobile scaling.
- Widen the main container (720 -> 960, 1120 on >=1280px) with fluid
  clamp() padding so wide screens are used better.
- Wrap the top nav and allow it to reflow on narrow screens.
- Collapse the key/value grid to a single column and enlarge touch
  targets on small screens.
- Keep single-form pages (login/signup/activate) in a readable narrow
  column instead of stretching full width.
This commit is contained in:
Gerhard Scheikl
2026-06-01 21:06:18 +02:00
parent 2c2afa458e
commit 0fbabdad31
5 changed files with 66 additions and 8 deletions
+2 -2
View File
@@ -77,7 +77,7 @@ export default function SignupPage() {
if (submitted) {
return (
<div className="card">
<div className="card form-card">
<h1>Check your email</h1>
<p>
We sent a confirmation link to <strong>{email}</strong>. Click the
@@ -106,7 +106,7 @@ export default function SignupPage() {
}
return (
<div className="card">
<div className="card form-card">
<h1>Sign up</h1>
<form onSubmit={onSubmit}>
<label htmlFor="email">Email</label>