dashboard(swarm): themed stop confirm modal with graceful checkbox
Replace the browser-native confirm() on the agent ST0P actions (per-agent menu + bulk) with an in-theme modal (themedConfirm in common.js), carrying a 'stop gracefully' checkbox. Checked sends POST /kill/<name>?graceful=1 (the quiesce path); unchecked is today's immediate hard stop, unchanged. The modal also covers the other destructive menu actions (restart / rebuild / destroy / purge) so they no longer fall back to the OS dialog.
This commit is contained in:
parent
9a6306540b
commit
03b10d22cd
3 changed files with 153 additions and 8 deletions
|
|
@ -414,6 +414,59 @@ body.dashboard-shell {
|
|||
}
|
||||
.container-row .actions form.inline { display: inline-block; margin: 0; }
|
||||
|
||||
/* Themed confirm modal — `themedConfirm()` in common.js. In-theme replacement
|
||||
for the native confirm() on destructive actions (stop / restart / destroy),
|
||||
carrying the optional "stop gracefully" checkbox. */
|
||||
.tc-backdrop {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: 1000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 1em;
|
||||
background: color-mix(in srgb, var(--crust) 60%, transparent);
|
||||
-webkit-backdrop-filter: blur(2px);
|
||||
backdrop-filter: blur(2px);
|
||||
}
|
||||
.tc-box {
|
||||
background: var(--bg-elev);
|
||||
border: 1px solid var(--purple-dim);
|
||||
box-shadow: 0 8px 40px -8px var(--crust);
|
||||
padding: 1.2em 1.4em;
|
||||
max-width: min(32em, 92vw);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.9em;
|
||||
}
|
||||
.tc-title {
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.08em;
|
||||
color: var(--subtext0);
|
||||
}
|
||||
.tc-message { color: var(--fg); line-height: 1.45; }
|
||||
.tc-checks { display: flex; flex-direction: column; gap: 0.4em; }
|
||||
.tc-checkrow {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 0.5em;
|
||||
cursor: pointer;
|
||||
color: var(--subtext0);
|
||||
font-size: 0.92em;
|
||||
line-height: 1.35;
|
||||
}
|
||||
.tc-checkrow .tc-check { margin-top: 0.2em; flex: 0 0 auto; }
|
||||
.tc-actions {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
gap: 0.6em;
|
||||
margin-top: 0.2em;
|
||||
}
|
||||
.tc-cancel { color: var(--subtext0); }
|
||||
.tc-confirm { color: var(--green); }
|
||||
.tc-confirm.tc-danger { color: var(--red); }
|
||||
|
||||
.agent-status {
|
||||
font-size: 0.82em;
|
||||
color: var(--subtext0);
|
||||
|
|
|
|||
Loading…
Reference in a new issue