m/postcards
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

CSS: reduce header→form spacing (gap under the header is too big) #20

New Issue
Closed
opened 2026-06-17 08:44:40 +00:00 by mAi · 2 comments
mAi commented 2026-06-17 08:44:40 +00:00
Collaborator
Copy Link

What

m: the padding/margin from the header to the form (the gap under the page header, above where the form starts) is too big. Tighten it.

Scope

CSS only — web/static/style.css (the header/hero block's bottom margin or the form/main top padding). Reduce the gap to a tasteful, tighter value; mobile-first (check phone + desktop). Don't reintroduce the #13 issues (section-header bleed, margins) — just the top header→form gap.

Sequencing / bundling

Small CSS nudge — bundle into one polish shift with #16 (theme-reset) and #17 (favicon) rather than a worker per one-liner. Same compose/static track.

DoD

  • Gap between the header and the start of the form is visibly tighter, balanced on mobile + desktop.
  • No regression to #13's fixes. build green; commit references this issue.
## What m: the **padding/margin from the header to the form** (the gap **under the page header**, above where the form starts) is **too big**. Tighten it. ## Scope CSS only — `web/static/style.css` (the header/hero block's bottom margin or the form/main top padding). Reduce the gap to a tasteful, tighter value; mobile-first (check phone + desktop). Don't reintroduce the #13 issues (section-header bleed, margins) — just the top header→form gap. ## Sequencing / bundling Small CSS nudge — **bundle into one polish shift with #16 (theme-reset) and #17 (favicon)** rather than a worker per one-liner. Same compose/static track. ## DoD - Gap between the header and the start of the form is visibly tighter, balanced on mobile + desktop. - No regression to #13's fixes. build green; commit references this issue.
mAi commented 2026-06-17 09:34:57 +00:00
Author
Collaborator
Copy Link

Done ✅ — tightened header → form gap

CSS only. The gap under the brand header was driven by .card { margin-top: 1.25rem } plus the unstyled <header> flow.

  • Added header { margin-bottom: 0.35rem; } — binds the brand to the content it introduces.
  • Reduced .card { margin-top: 1.25rem → 0.5rem }.

No regression to #13's section-header/.choice-label spacing (those rules are untouched). Applies consistently across compose, postcard and admin (all use .card); the landing hero keeps its own padding.

build / vet / test green.

Commit: 3ae968445b

## Done ✅ — tightened header → form gap CSS only. The gap under the brand header was driven by `.card { margin-top: 1.25rem }` plus the unstyled `<header>` flow. - Added `header { margin-bottom: 0.35rem; }` — binds the brand to the content it introduces. - Reduced `.card { margin-top: 1.25rem → 0.5rem }`. No regression to #13's section-header/`.choice-label` spacing (those rules are untouched). Applies consistently across compose, postcard and admin (all use `.card`); the landing hero keeps its own padding. build / vet / test green. Commit: https://mgit.msbls.de/m/postcards/commit/3ae968445befd70116929bf5f2ed1adbfab8bd2f
mAi commented 2026-06-17 09:41:32 +00:00
Author
Collaborator
Copy Link

✅ Live — merged 3ae9684 (merge 9a8eda4), deployed. Header→form gap tightened (CSS). No regression to #13. Please eyeball. Not closing — m closes.

## ✅ Live — merged `3ae9684` (merge `9a8eda4`), deployed. Header→form gap tightened (CSS). No regression to #13. Please eyeball. Not closing — m closes.
mAi closed this issue 2026-06-23 15:48:03 +00:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
No items
No Label
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
mAi m
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: m/postcards#20
No description provided.
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?