ui: stop Run-now buttons wrapping to two lines

Three sites:
* Schedules list per-row Run-now / Edit / Delete column was 1fr
  next to a 1.3fr retention column — too narrow for the three
  buttons. Pin the action column to 240px and add
  whitespace-nowrap to each button so the layout can't squeeze
  them onto two lines regardless.
* Dashboard host_row Run-now button got whitespace-nowrap +
    for the same reason inside the 92px action column.
* Host detail header "Run backup now" —   the words so the
  button never breaks across lines if the header gets crowded.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-05-02 13:59:42 +01:00
parent 413d0bdb1b
commit 457a7e049c
4 changed files with 10 additions and 10 deletions
+2 -2
View File
@@ -39,7 +39,7 @@
</div>
<div class="flex items-center gap-2">
{{if eq $host.Status "offline"}}
<button class="btn" disabled title="agent is offline">Run backup now</button>
<button class="btn" disabled title="agent is offline">Run&nbsp;backup&nbsp;now</button>
{{else if not $host.RepoInitialisedAt}}
<button class="btn btn-danger"
hx-post="/hosts/{{$host.ID}}/init-repo"
@@ -50,7 +50,7 @@
<button class="btn btn-primary"
hx-post="/hosts/{{$host.ID}}/run-backup"
hx-swap="none"
hx-disabled-elt="this">Run backup now</button>
hx-disabled-elt="this">Run&nbsp;backup&nbsp;now</button>
{{end}}
<button class="btn">Edit credentials</button>
<button class="btn btn-ghost text-base px-2.5"></button>
+5 -5
View File
@@ -56,7 +56,7 @@
</div>
{{else}}
<div class="hairline grid items-baseline px-4 py-2.5 text-[11px] text-ink-fade uppercase tracking-[0.08em]"
style="grid-template-columns: 0.6fr 1.1fr 2fr 1.3fr 0.5fr 1fr; column-gap: 18px;">
style="grid-template-columns: 0.55fr 1fr 1.7fr 1.1fr 0.5fr 240px; column-gap: 18px;">
<div>Status</div>
<div>When</div>
<div>Paths</div>
@@ -66,7 +66,7 @@
</div>
{{range $page.Schedules}}
<div class="grid items-center px-4 py-3 text-[13px] hairline"
style="grid-template-columns: 0.6fr 1.1fr 2fr 1.3fr 0.5fr 1fr; column-gap: 18px;">
style="grid-template-columns: 0.55fr 1fr 1.7fr 1.1fr 0.5fr 240px; column-gap: 18px;">
<div class="flex flex-col gap-0.5">
{{if .Enabled}}
<span class="mono text-[11px] text-ok">enabled</span>
@@ -85,15 +85,15 @@
</div>
<div class="text-right flex gap-1.5 justify-end">
{{if and .Enabled (eq $host.Status "online")}}
<button class="btn btn-primary"
<button class="btn btn-primary whitespace-nowrap"
hx-post="/hosts/{{$host.ID}}/schedules/{{.ID}}/run"
hx-swap="none"
hx-disabled-elt="this">Run now</button>
{{end}}
<a href="/hosts/{{$host.ID}}/schedules/{{.ID}}/edit" class="btn">Edit</a>
<a href="/hosts/{{$host.ID}}/schedules/{{.ID}}/edit" class="btn whitespace-nowrap">Edit</a>
<form method="post" action="/hosts/{{$host.ID}}/schedules/{{.ID}}/delete" style="display: inline;"
onsubmit="return confirm('Delete this schedule? Existing snapshots are not affected.');">
<button type="submit" class="btn btn-danger">Delete</button>
<button type="submit" class="btn btn-danger whitespace-nowrap">Delete</button>
</form>
</div>
</div>
+2 -2
View File
@@ -63,10 +63,10 @@
hx-swap="none"
hx-disabled-elt="this">Retry</button>
{{- else -}}
<button class="btn"
<button class="btn whitespace-nowrap"
hx-post="/hosts/{{.ID}}/run-backup"
hx-swap="none"
hx-disabled-elt="this">Run now</button>
hx-disabled-elt="this">Run&nbsp;now</button>
{{- end -}}
</div>
</div>