fix: simplify notifications and shorten display time

Use compact neutral notification cards with vertically aligned icons, text, and close controls. Dismiss success and info messages after two seconds; keep errors visible until dismissed. Release note: Notifications now use a cleaner compact layout, and success and info messages disappear after two seconds.
2026-09-23 11:51:17 +08:00
parent f7541203e4
commit be84534e77
5 changed files with 36 additions and 28 deletions
@@ -65,6 +65,12 @@ app.whenReady().then(async () => {
      const before = await js('document.activeElement.className')
      await notify('success')
      assert.equal(await js('document.activeElement.className'), before, 'Notification stole focus')
+      assert(await js(`Array.from(document.querySelectorAll('.app-notification')).every(card => {
+        const center = element => { const r = element.getBoundingClientRect(); return r.top + r.height / 2 }
+        const middle = center(card)
+        return [card.querySelector(':scope > svg'), card.querySelector('span'), card.querySelector('button svg')]
+          .every(element => Math.abs(center(element) - middle) <= 1)
+      })`), 'Notification icon, text and close icon must share the vertical center')
      await screenshot(`${theme}-${width}-notification`)
      await click('.app-notification--error button')
      await click('.app-notification--success button')