Repository navigation
Line up a notification's button with its text when it has no icon - #28042
brennanb2025 wants to merge 1 commit into
Conversation
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info
📝 Walkthrough
Priority: ⬇️ Low Severity of issue fixed: Low Merge Risk: ⚪ Minimal · up to The stylesheet aligns iconless toast actions with their text while preserving spacing after icons; no material merge-blocking risk remains. Pre-merge checks ·
|
|
After restart, the “Resumed chats” notification put Show 26px to the right of its text because the shared stylesheet reserved icon space even when no icon rendered. This PR removes that empty indent from native notification buttons without icons and preserves the existing spacing when an icon is present. Reviewed Fresh hidden-app QA ran on M4Air using OpenCode QA remains incomplete. The driver exited with CI is red from the existing main-branch failure: static analysis imports The temporary M4Air worktree No merge, rebase, auto-merge, or draft-state change was performed. Source review is clean; this is not an unconditional QA pass. Constructed previous spacing: Reviewed spacing: |
|
Closing: the resume toast this started from was redesigned in #28068 (icon + inline action), and the small misalignment left on other toasts with a button isn't worth a change on its own. |


ELI5
Some notifications in the bottom-right corner have a button but no icon. On those, the button sat indented under nothing, about the width of a missing icon away from the text above it. After a restart, the "Resumed 14 chats" notification looked broken: its Show button floated out of line under the title.
Now the button lines up with the text whenever the notification has no icon. Notifications that do have an icon look exactly as before.
What Changed
This touches only the shared notification stylesheet (
main.css). It fixes every icon-less notification that has a button, not just the resume one (dictation, activity clear, external file change, and others).Why
The indent was written for icon notifications and applied to all of them. Making the indent depend on the icon fixes the cause, so it's better than giving the resume notification an icon just to fill the gap: that would leave the other icon-less notifications broken and change several test mocks for nothing. The selector uses a plain sibling match (
[data-icon] ~ [data-button]) instead of:has(), which keeps clear of the style recalculation cost an earlier:has()rule in this file caused.Linked Issue
N/A (maintainer report from a screenshot of the resume notification)
Visual Proof
The real "Resumed 3 chats" toast, captured the moment it appeared. Both runs used a hidden Orca dev build on a throwaway profile, driven only through the developer tools connection. Three real Claude chats were left running a 5-minute command, Orca was quit, and on relaunch the chats were resumed from the dialog. Before = current main (c62c5a4). After = this PR plus #27580, merged locally.
Measured in the app: before, the button's left edge sat 26px right of the title (x 1331 vs 1305). After, both are at x 1305.
The first check was a headless Chromium render of the three toast shapes (no icon, with an icon, no icon with a description), using the toast library's stylesheet plus Orca's:
Testing
orca-ci-checks: 22 of 24 passed. The two failures are unrelated to this change.audit:code-quality:nativealso fails on current main (a config script's imports from ci: stop new main-process code from freezing Orca with synchronous launches #27756), andtypecheck:cifails locally with Bun'sScript not found "check". The plainpnpm run typecheckpassed.No automated test: this is a CSS-only change, and the before/after render above covers it.
I manually tested these changes locally (real resume in a hidden dev build, macOS, light theme; see Visual Proof)
Automated tests added/updated, or explained why not below
Review
Agent skill upstream boundary
Notes
CSS only, in the renderer. It has no effect on platform, SSH, mobile or compatibility, and right-to-left layout is unchanged: the indent was already a left margin.
Checklist
N/Awith reasonpnpm lint,pnpm typecheck,pnpm test, andpnpm buildpass (or CI will cover; local preferred)