Skip to content

Show only the newest toast on a phone - #60

Merged
codeministry merged 1 commit into
mainfrom
fix/mobile-one-toast
Nov 9, 2026
Merged

codeministry merged 1 commit into
mainfrom
fix/mobile-one-toast

Conversation

@codeministry

Copy link
Copy Markdown
Owner

Below 48rem the toast stack runs the full width above the bottom bar, and three toasts in a row took about a third of a phone's height.

  • toast-stack.css: below 48rem, .lg-toasts > :not(:last-child) is hidden, so only the newest toast shows. The older ones stay in the store with their timers running and show again when the newest goes. From 48rem up nothing changes.
  • toast-stack.browser.spec.ts: at 390px three toasts show one, the newest; at 1280px all three. The 390px case was red before the rule.
  • Design record and CHANGELOG note it.

Verified: all 22 browser test files (370 tests), the toast unit tests and check:static green.

Below 48rem the stack runs the full width above the bottom bar, and three toasts took a third of the screen. The stylesheet now shows the newest one there; the older ones stay in the store and return when it goes.
@codeministry codeministry self-assigned this Nov 9, 2026
@codeministry
codeministry merged commit 03ecc21 into main Nov 9, 2026
6 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant