Follows the design and guard commits before it. Written by Sonnet,
reviewed by Opus.
The report address
- Baseline: users.dmarc_default_mode, users.dmarc_default_address and
domains.dmarc_rua_user_id are gone. domains.dmarc_rua alone says
where reports go: '' is no reports (a new domain), the address
SelfPost derives for the domain is the hosted choice (while hosted
reports are on), anything else is a typed address.
- Removed: the user default and its store functions, a domain
following a user, keep / inherit, followCreator, POST /account/dmarc
with its handler, the DMARC box of Account, the user-delete item
about domains losing their address.
- Domain settings offers the three choices; beside the typed address a
"Use my e-mail" button fills in the profile e-mail (panel.js: one
generic data-fill hook; absent without a profile e-mail; it fills,
it does not save).
- The DMARC record's note names the address and no user. This closes
L4 of the security review.
- Domain export / import carries the address as a plain string.
- The ingest allow-list is the generic mailbox plus each domain's
address on this host; the generic mailbox is always open now.
- dev/migrate1x (not in the tree): a 1.x domain that inherited the
instance default gets that address as its own, so no published rua=
changes.
Row actions
- row_action partial (RowAction: Label, Post, Confirm, Danger);
panel.css has the mockup's three rules. A row of the Applications
table is Edit, New password, Delete; the confirmation texts are the
ones the application page's head uses. Both roles, with the checks
of the application page.
Tests cover: a new domain has no reports; each choice saved and shown
selected; hosted refused when hosted reports are off; a bad address
refused with what was typed kept; an untouched save changes nothing in
each state; the fill button with and without a profile e-mail; deleting
a user leaves every domain's address; the row's forms, targets and
confirmations for both roles and a 404 for a stranger.
Known: if hosted reports are switched off later, a stored hosted address
reads as a typed one. docs/guide.md still describes the old choices -
the documentation step.
Evidence
- docs/assets/panel-redesign/evidence/account.png,
out-domain-settings.png, out-domain.png, user-delete.png, help.png:
1440 px wide, headless Edge, real templates served locally with
their fixtures - NOT from the container.
- panel/audit.js on out-domain, out-domain-settings, account, help,
components and user-delete at 1440 and 1280: 1420 texts checked,
problems: [].
- In a browser: the fill button sets the field and does not submit;
the row buttons have the font, size and colour of the Edit link,
Delete the red of the other delete links; data-confirm fires on
both. Hover and focus states were not observed.
- go test -count=1 ./internal/web/... ./internal/store/...
./internal/dmarc/... ./internal/app/... ./internal/inbound/...
./cmd/panel: ok (ten packages; dev/migrate1x also ok).
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
154 lines
6.4 KiB
HTML
154 lines
6.4 KiB
HTML
{{/* The kit page (GET /server/components): every partial of components.html in
|
|
every state, filled from kit.go — the mockup components page rebuilt with
|
|
the real templates. Like any page it is thin: partial calls with structs,
|
|
Bulma layout classes, and the page utilities; the markup of a component is
|
|
written in components.html and nowhere else. */}}
|
|
{{define "content"}}
|
|
{{template "page_head" .Head}}
|
|
|
|
{{template "flash" .Flash}}
|
|
{{template "flash" .FlashError}}
|
|
|
|
{{template "box_open" .Layouts}}
|
|
{{template "body_open"}}
|
|
{{template "facts" .LayoutFacts}}
|
|
{{template "body_close"}}
|
|
{{template "box_close"}}
|
|
|
|
<div class="columns">
|
|
<div class="column is-6">
|
|
{{template "box_open" .Postmark}}
|
|
{{template "body_open"}}
|
|
<div class="buttons">{{range .Postmarks}}
|
|
{{template "postmark" .}}{{end}}
|
|
</div>
|
|
<p class="sp-muted">Only inside page_head, at most one per page, and only where the page has a verdict to give.</p>
|
|
{{template "body_close"}}
|
|
{{template "box_close"}}
|
|
|
|
{{template "box_open" .StatusTag}}
|
|
<div class="table-container"><table class="table is-fullwidth">
|
|
<thead><tr><th>Status</th><th>Tag</th><th>Bulma classes</th></tr></thead>
|
|
<tbody>{{range .StatusRows}}
|
|
<tr><td>{{.Words}}</td><td>{{template "tag" .Tag}}</td><td class="sp-mono sp-small">{{status_tag .Tag.Status}}</td></tr>{{end}}
|
|
</tbody>
|
|
</table></div>
|
|
{{template "box_close"}}
|
|
</div>
|
|
|
|
<div class="column is-6">
|
|
{{template "box_open" .BoxHead}}
|
|
{{template "body_open"}}
|
|
<p class="mb-2">The <i class="ti ti-help-circle"></i> after the end slot is <code>sp-help</code>: an optional link to the section's topic on the Help page. It replaces today's help drawer.</p>
|
|
<p>box_body — padded content. A <code>table</code> or a run of <code>sp-record</code> blocks sits directly in the box, without box_body.</p>
|
|
{{template "body_close"}}
|
|
{{template "box_foot" .BoxFoot}}
|
|
{{template "box_close"}}
|
|
|
|
{{template "box_open" .DangerZone}}
|
|
{{template "body_open"}}
|
|
<p>For destructive confirmations and the "delete" entry of a settings page. The number may be an icon when the box is not part of a sequence.</p>
|
|
{{template "body_close"}}
|
|
{{template "box_close"}}
|
|
|
|
{{template "box_open" .Credential}}
|
|
{{template "body_open"}}
|
|
<p>Only for a secret the panel will never show again.</p>
|
|
{{template "body_close"}}
|
|
{{template "box_close"}}
|
|
</div>
|
|
</div>
|
|
|
|
{{template "box_open" .HealthCard}}
|
|
{{template "health_cards" .HealthCards}}
|
|
{{template "box_close"}}
|
|
|
|
<div class="columns">
|
|
<div class="column is-7">
|
|
{{template "box_open" .DNSRecord}}
|
|
{{range .Records}}{{template "dns_record" .}}
|
|
{{end}}{{template "box_close"}}
|
|
|
|
{{template "box_open" .Tables}}
|
|
<div class="table-container"><table class="table is-fullwidth is-hoverable">
|
|
<thead><tr><th>Time, UTC</th><th>Name</th><th>sp-clip</th><th>Status</th><th></th></tr></thead>
|
|
<tbody>
|
|
<tr><td class="sp-mono sp-muted sp-nowrap sp-small">09-21 14:01:52</td><td><a href="#"><strong>the row's link</strong></a></td><td class="sp-clip">A long subject is clipped with an ellipsis instead of wrapping the row</td><td><span class="{{status_tag "sent"}}">sent</span></td><td class="sp-actions"><a href="#">Details</a>{{template "row_action" .RowAction}}</td></tr>
|
|
</tbody>
|
|
</table></div>
|
|
{{template "box_foot" .TablesFoot}}
|
|
{{template "box_close"}}
|
|
|
|
{{template "box_open" .LogPane}}
|
|
{{template "log_pane" .LogLines}}
|
|
{{template "box_close"}}
|
|
</div>
|
|
|
|
<div class="column is-5">
|
|
{{template "box_open" .Facts}}
|
|
{{template "body_open"}}
|
|
{{template "facts" .FactList}}
|
|
{{template "body_close"}}
|
|
{{template "box_close"}}
|
|
|
|
{{template "box_open" .Timeline}}
|
|
{{template "body_open"}}
|
|
{{template "timeline" .Steps}}
|
|
{{template "body_close"}}
|
|
{{template "box_close"}}
|
|
|
|
{{template "box_open" .EmptyState}}
|
|
{{template "empty_state" .Empty}}
|
|
{{template "box_close"}}
|
|
|
|
{{template "box_open" .ConfirmList}}
|
|
{{template "body_open"}}
|
|
{{template "confirm_list" .Confirm}}
|
|
{{template "body_close"}}
|
|
{{template "box_close"}}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="columns">
|
|
<div class="column is-3">
|
|
{{template "side_menu" .SideMenu}}
|
|
</div>
|
|
<div class="column is-9">
|
|
{{template "box_open" .FormRows}}
|
|
{{template "body_open"}}
|
|
<div class="sp-form">
|
|
<div class="sp-row">
|
|
<div class="field"><label class="label">sp-row — a wide field</label><div class="control"><input class="input" value="host"></div></div>
|
|
<div class="field"><label class="label">and a short one</label><div class="control"><input class="input" value="25"></div></div>
|
|
</div>
|
|
<div class="sp-pair">
|
|
<div class="field"><label class="label">sp-pair — two equal fields</label><div class="control"><input class="input" type="password"></div></div>
|
|
<div class="field"><label class="label">Repeat</label><div class="control"><input class="input" type="password"></div><p class="help">Help text lives in Bulma's <code>help</code>.</p></div>
|
|
</div>
|
|
</div>
|
|
{{template "route" .Route}}
|
|
{{template "body_close"}}
|
|
{{template "help_topic" .HelpTopic}}
|
|
{{template "box_close"}}
|
|
</div>
|
|
</div>
|
|
|
|
{{template "box_open" .Shell}}
|
|
{{template "body_open"}}
|
|
{{template "facts" .ShellFacts}}
|
|
{{template "body_close"}}
|
|
{{template "box_close"}}
|
|
|
|
{{template "box_open" .TypeScale}}
|
|
<div class="table-container"><table class="table is-fullwidth">
|
|
<thead><tr><th>Size</th><th>Looks like</th><th>Used for</th></tr></thead>
|
|
<tbody>
|
|
<tr><td class="sp-mono sp-small">body · 16px</td><td>The quick brown fox, 203.0.113.25</td><td class="sp-muted">Text, table cells, inputs, selects, buttons, menus and their dropdowns</td></tr>
|
|
<tr><td class="sp-mono sp-small">--sp-fs-s · 14px</td><td class="sp-small">The quick brown fox, <span class="sp-mono">203.0.113.25</span></td><td class="sp-muted">Supporting text: labels, <code>help</code>, notes in a box head or foot, mono values (<code>sp-small</code>), logs, the footer</td></tr>
|
|
<tr><td class="sp-mono sp-small">--sp-fs-xs · 13px</td><td>{{template "kicker" .KickerSample}} <span class="tag is-light">tag</span></td><td class="sp-muted">Upper-case mono micro-labels (kicker, table head, <code>dt</code>, box title) and tags — nothing else</td></tr>
|
|
</tbody>
|
|
</table></div>
|
|
{{template "box_foot" .TypeScaleFoot}}
|
|
{{template "box_close"}}
|
|
{{end}}
|