Widen the webhook page by half so an entrypoint URL fits on one line (closes #350) #419

Merged
clawbot merged 1 commits from issue-350-wider-webhook-page into next 2026-10-02 09:49:34 +02:00
Collaborator

The webhook page's container was capped at 72rem (1152 px, max-w-6xl). It is now capped at 108rem (1728 px), 50% wider. In a 1920-pixel window the page is now 1728 px wide, and in a 1440-pixel window it fills the window. An entrypoint URL of about 70 characters used to wrap at both widths. Now it stays on one line, with room for about 80 characters at 1440 and 100 at 1920, Copy button included. The statistics pane and both columns widen with the container.

The width is set with an inline style, not a Tailwind class. The committed static/css/tailwind.css has no class wider than max-w-6xl, and adding one means regenerating it with the unpinned tool (#231). The page's security policy already allows inline styles.

The title row now wraps. At phone width on next its buttons already pushed Delete off the screen and made the page scroll sideways; now they drop below the title.

  • Deviation: the plan suggested a rule in static/css/style.css, but no page loads that file; the inline style replaces it.
  • Judgement call: only the webhook page widens. The webhook list, the event log, the navbar and the footer keep 72rem, so on a wide window this page is wider than the navbar.
  • Judgement call: I chose 50%, the low end of the owner's range, so a 1920-pixel window keeps a margin.
  • Judgement call: the title-row wrap goes beyond widening; the definition of done asks for no sideways scrolling at phone width.

Model: opus-5-5

The webhook page's container was capped at 72rem (1152 px, `max-w-6xl`). It is now capped at 108rem (1728 px), 50% wider. In a 1920-pixel window the page is now 1728 px wide, and in a 1440-pixel window it fills the window. An entrypoint URL of about 70 characters used to wrap at both widths. Now it stays on one line, with room for about 80 characters at 1440 and 100 at 1920, Copy button included. The statistics pane and both columns widen with the container. The width is set with an inline style, not a Tailwind class. The committed `static/css/tailwind.css` has no class wider than `max-w-6xl`, and adding one means regenerating it with the unpinned tool (https://git.eeqj.de/sneak/webhooker/issues/231). The page's security policy already allows inline styles. The title row now wraps. At phone width on `next` its buttons already pushed Delete off the screen and made the page scroll sideways; now they drop below the title. - Deviation: the plan suggested a rule in `static/css/style.css`, but no page loads that file; the inline style replaces it. - Judgement call: only the webhook page widens. The webhook list, the event log, the navbar and the footer keep 72rem, so on a wide window this page is wider than the navbar. - Judgement call: I chose 50%, the low end of the owner's range, so a 1920-pixel window keeps a margin. - Judgement call: the title-row wrap goes beyond widening; the definition of done asks for no sideways scrolling at phone width. Model: opus-5-5
clawbot added the needs-review label 2026-10-02 08:12:49 +02:00
clawbot self-assigned this 2026-10-02 08:12:49 +02:00
clawbot force-pushed issue-350-wider-webhook-page from 477a8d07d3 to b33ea72448 2026-10-02 08:12:50 +02:00 Compare
Author
Collaborator

Review of #419 (#350): needs rework.

  1. Three sentences this PR adds say that every other page is 72rem wide, and that is not true of the tree. They are the comment above the container in templates/source_detail.html ("Half again as wide as the other pages (max-w-6xl, 72rem)"), the doc comment on TestHandleSourceDetail_FitsWideAndNarrowWindows in internal/handlers/source_detail_test.go ("the 72rem of max-w-6xl that the other pages use"), and the commit body ("The other pages, the navbar and the footer keep 72rem"). Only the webhook list, the event log, the navbar and the footer use max-w-6xl. The new-webhook, edit-webhook and edit-target forms use max-w-2xl, the profile and error pages use max-w-4xl, and the login page uses max-w-md. Acceptable: name what actually stays at 72rem, as the PR body already does, or drop the comparison and give only the 108rem width and the reason for it.

static/css/style.css is loaded by no page. No template links it, and it holds only a one-line comment, so a rule added there does nothing until a page links the file.

  • Judgement call: the inline style is acceptable. The page's Content-Security-Policy allows inline styles, browsers apply it under that policy, and no repo rule forbids a style attribute.

Model: opus-5-5

Review of https://git.eeqj.de/sneak/webhooker/pulls/419 (https://git.eeqj.de/sneak/webhooker/issues/350): needs rework. 1. Three sentences this PR adds say that every other page is 72rem wide, and that is not true of the tree. They are the comment above the container in `templates/source_detail.html` ("Half again as wide as the other pages (max-w-6xl, 72rem)"), the doc comment on `TestHandleSourceDetail_FitsWideAndNarrowWindows` in `internal/handlers/source_detail_test.go` ("the 72rem of max-w-6xl that the other pages use"), and the commit body ("The other pages, the navbar and the footer keep 72rem"). Only the webhook list, the event log, the navbar and the footer use `max-w-6xl`. The new-webhook, edit-webhook and edit-target forms use `max-w-2xl`, the profile and error pages use `max-w-4xl`, and the login page uses `max-w-md`. Acceptable: name what actually stays at 72rem, as the PR body already does, or drop the comparison and give only the 108rem width and the reason for it. `static/css/style.css` is loaded by no page. No template links it, and it holds only a one-line comment, so a rule added there does nothing until a page links the file. - Judgement call: the inline style is acceptable. The page's Content-Security-Policy allows inline styles, browsers apply it under that policy, and no repo rule forbids a style attribute. Model: opus-5-5
clawbot added needs-rework and removed needs-review labels 2026-10-02 09:06:34 +02:00
clawbot added 1 commit 2026-10-02 09:29:18 +02:00
The webhook page's container was capped at max-w-6xl, 72rem (1152
px), which made a typical entrypoint URL wrap even in a 1440-pixel
window. It is now capped at 108rem (1728 px). The width is an inline
style because the committed tailwind.css has no class that wide, and
regenerating it needs the unpinned tool. The other pages, the navbar
and the footer keep 72rem.

The title row now wraps: its three buttons made a phone-width window
scroll sideways.

Model: opus-5-5
clawbot force-pushed issue-350-wider-webhook-page from b33ea72448 to e85d5471fc 2026-10-02 09:29:18 +02:00 Compare
Author
Collaborator
  1. The comment above the container in templates/source_detail.html now gives the 108rem width as half again the 72rem of the webhook list, the event log, the navbar and the footer; the doc comment on TestHandleSourceDetail_FitsWideAndNarrowWindows now names the webhook list and the event log.
  • Deviation: the commit body still says "The other pages, the navbar and the footer keep 72rem"; the commit message is left to be fixed at merge.

Model: opus-5-5

1. The comment above the container in `templates/source_detail.html` now gives the 108rem width as half again the 72rem of the webhook list, the event log, the navbar and the footer; the doc comment on `TestHandleSourceDetail_FitsWideAndNarrowWindows` now names the webhook list and the event log. - Deviation: the commit body still says "The other pages, the navbar and the footer keep 72rem"; the commit message is left to be fixed at merge. Model: opus-5-5
clawbot added needs-review and removed needs-rework labels 2026-10-02 09:29:30 +02:00
Author
Collaborator

Review passed.

Model: opus-5-5

Review passed. Model: opus-5-5
clawbot merged commit c23ffbac65 into next 2026-10-02 09:49:34 +02:00
clawbot deleted branch issue-350-wider-webhook-page 2026-10-02 09:49:34 +02:00
Sign in to join this conversation.
No Reviewers
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: sneak/webhooker#419