fix(ios26): align toolbar and modal action insets - #264
Conversation
![devin-ai-integration[bot]](https://avatars.githubusercontent.com/in/811515?s=60&v=4){kind=small}
Playwright test results
Details
|
|
📊 Ionic 9 Playwright Test Report View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios27/pr-264/ Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run. |
|
📊 Ionic 9 Playwright Test Report View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios27/pr-264/ Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run. |
|
📊 Ionic 9 Playwright Test Report View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios27/pr-264/ Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run. |
|
📊 Ionic 9 Playwright Test Report View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios27/pr-264/ Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run. |
|
📊 Ionic 9 Playwright Test Report View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios27/pr-264/ Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run. |
|
/update-screenshots |
|
📊 Ionic 9 Playwright Test Report View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios27/pr-264/ Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run. |
|
✅ Screenshots have been updated successfully! The new screenshots have been committed to this PR. |
|
📊 Ionic 9 Playwright Test Report View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios27/pr-264/ Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run. |
Co-Authored-By: rdlabo <sakakibara@rdlabo.jp>
|
📊 Ionic 9 Playwright Test Report View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios27/pr-264/ Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run. |
Co-Authored-By: rdlabo <sakakibara@rdlabo.jp>
|
📊 Ionic 9 Playwright Test Report View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios27/pr-264/ Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run. |
|
/update-screenshots |
|
📊 Ionic 9 Playwright Test Report View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios27/pr-264/ Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run. |
|
✅ Screenshots have been updated successfully! The new screenshots have been committed to this PR. |
|
/update-screenshots |
|
📊 Ionic 9 Playwright Test Report View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios27/pr-264/ Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run. |
|
✅ Screenshots have been updated successfully! The new screenshots have been committed to this PR. |
|
📊 Ionic 9 Playwright Test Report View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios27/pr-264/ Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run. |
npm beta publishedCI passed for the merge commit npm install @rdlabo/ionic-theme-ios26@9.4.1-beta.pr264.sha905eb231473e |
1 participant
Individual toolbar buttons sit closer to the edge than grouped actions, and same-slot groups and buttons double their adjacent margins. Card and sheet headers also place 44px controls 2px below the measured iOS 26 baseline; sheets add an extra 4px horizontal inset.
Give standalone actions the same outer margin as grouped actions and share a 12px gap between same-slot siblings. Set card/sheet toolbar height to match the 16px top inset, retain a 10px inset for centered dialogs, and remove the sheet-only horizontal padding. Existing independent glass controls, button sizes, optional back-button text and CSS customization remain intact.
Only two SCSS files change (26 additions, 7 deletions). No tests or screenshot baselines are added or changed.
Validation: iOS 26.5 iPhone/iPad system measurements, 240 temporary modal layout combinations, seven existing toolbar/opt-out tests, root and demo lint, Sass compilation and diff checks. Temporary diagnostics stay outside the repository. Canonical Linux screenshot baselines still need regeneration; these checks do not imply that screenshot CI has passed.