feat(ui): restyle unsaved-changes bar as a compact inverted card (#893)

* feat(ui): restyle unsaved-changes bar as a compact inverted card Show Page.SettingsActions only when the form is dirty, as a centered dark card with a secondary Discard button and a primary Save button. Co-authored-by: best <[email protected]> * fix(ui): announce settings actions from a persistent live region Keep role=status mounted outside the dirty-state card so screen readers still hear the status when the bar appears, without live-region wrapping the Discard/Save buttons. Co-authored-by: best <[email protected]> --------- Co-authored-by: Cursor Agent <[email protected]>
2026-08-14 10:53:28 +01:00
parent 7ba551aa43
commit 41d810d4f7
4 changed files with 56 additions and 54 deletions
@@ -428,7 +428,9 @@
      </Page.Header>
      <Page.Body>
        {#snippet child()}
-          <div class="text-muted-foreground rounded-lg border border-dashed p-6 text-sm">All changes saved.</div>
+          <div class="text-muted-foreground rounded-lg border border-dashed p-6 text-sm">
+            All changes saved. The compact save card stays hidden until the form is dirty.
+          </div>
        {/snippet}
      </Page.Body>
      <Page.SettingsActions