indifferentketchup/sortof
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Stage warning actions; defer sort to explicit click

Browse Source 
Add/remove/swap warning-action handlers no longer auto-fire /api/sort.
They mutate the input textarea idempotently; the sort button gets a
pending cue when current input != last-sorted input. Branch-picker
(/api/resort, cheap) keeps instant behavior. Spec lives in
docs/specs/2026-05-04-staged-warning-actions.md.
This commit is contained in:
indifferentketchup
2026-05-04 14:16:33 +00:00
parent 55d3794bfb
commit a15d35214e
3 changed files with 255 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
frontend/index.html
View File

@@ -529,6 +529,17 @@
box-shadow: var(--brand-shadow-card);
}
.sort-btn:active { filter: brightness(0.92); transform: translateY(1px); }
/* Pending changes: input differs from last-sorted input. Subtle pulsing
* info-toned ring around the brand-filled button so the CTA still reads as
* primary but the user sees "you have unapplied edits". */
.sort-btn.sort-pending {
box-shadow: 0 0 0 2px var(--info, var(--acc-blue)), var(--brand-shadow-card);
animation: sort-pending-pulse 1.6s ease-in-out infinite;
}
@keyframes sort-pending-pulse {
0%, 100% { box-shadow: 0 0 0 2px var(--info, var(--acc-blue)), var(--brand-shadow-card); }
50% { box-shadow: 0 0 0 4px var(--info, var(--acc-blue)), var(--brand-shadow-card); }
}
.sort-btn[disabled] {
cursor: not-allowed;
border-color: var(--border);
@@ -1029,6 +1040,26 @@
color: var(--brand-ink);
border-color: var(--error);
}
/* Staged warning row: edit applied to input but not yet sorted. Subtle —
* strike + dim — so the row stays readable but visibly "addressed". The
* action button itself flips to the success palette via .warn-action.staged
* to signal "click again to undo". */
.warn-list li.staged .w-msg,
.warn-list li.staged .w-tag {
opacity: 0.55;
text-decoration: line-through;
}
.warn-action.staged {
border-color: var(--success, var(--acc-green));
background: var(--success-bg, rgba(80,180,120,0.18));
color: var(--success, var(--acc-green));
opacity: 1;
text-decoration: none;
}
.warn-action.staged:hover {
background: var(--success, var(--acc-green));
color: var(--brand-ink);
}
/* Inline mod-name hyperlink inside warning messages. Inherits the message
* color so reading flow isn't disrupted; underline + brand color on hover
* signals it's clickable. */