Skip to content

feat: improve iOS input outlines and supporting text - #124

Merged
rdlabo merged 6 commits into
mainfrom
feat/ios-outline-inputs
Aug 24, 2026
Merged

feat: improve iOS input outlines and supporting text#124
rdlabo merged 6 commits into
mainfrom
feat/ios-outline-inputs

Conversation

@rdlabo

@rdlabo rdlabo commented Aug 23, 2026

Copy link
Copy Markdown
Contributor

Summary

  • add an iOS outline appearance for ion-input and ion-textarea
  • stack labels above outlined controls and align their focus and invalid colors with the border
  • tune outlined field dimensions, padding, placeholder opacity, and spacing
  • handle helperText and errorText consistently for regular and outlined fields in inset lists
  • hide empty supporting-text containers and remove row dividers only when a field needs supporting-text or outline spacing
  • expand the inputs demo with standalone, helper, and error variants for both input and textarea
  • verify the added demo variants with unit tests

Verification

  • npm run build
  • cd demo && npm test -- --watch=false (35 tests passed)

@github-actions

github-actions Bot commented Aug 23, 2026

Copy link
Copy Markdown
Contributor

Playwright test results

passed  90 passed

Details

stats  90 tests across 2 suites
duration  1 minute, 50 seconds
commit  20e6909
info  This detailed result covers Ionic 9 only. Ionic 8 runs against the same screenshots in a separate matrix job; check the workflow run for both results. To update the screenshots, comment with /update-screenshots.

@github-actions

Copy link
Copy Markdown
Contributor

📊 Ionic 9 Playwright Test Report

View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios26/pr-124/

Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run.

github-actions Bot added a commit that referenced this pull request Aug 23, 2026
@rdlabo rdlabo changed the title feat: style outlined iOS inputs feat: style iOS inputs and supporting text Aug 23, 2026
@github-actions

Copy link
Copy Markdown
Contributor

📊 Ionic 9 Playwright Test Report

View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios26/pr-124/

Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run.

github-actions Bot added a commit that referenced this pull request Aug 23, 2026
@rdlabo rdlabo changed the title feat: style iOS inputs and supporting text feat: improve iOS input outlines and supporting text Aug 24, 2026
@rdlabo

rdlabo commented Aug 24, 2026

Copy link
Copy Markdown
Contributor Author

/update-screenshots

@github-actions

Copy link
Copy Markdown
Contributor

📊 Ionic 9 Playwright Test Report

View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios26/pr-124/

Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run.

github-actions Bot added a commit that referenced this pull request Aug 24, 2026
@github-actions

Copy link
Copy Markdown
Contributor

❌ Failed to update screenshots.

Please check the workflow run for details.

@rdlabo

rdlabo commented Aug 24, 2026

Copy link
Copy Markdown
Contributor Author

/update-screenshots

1 similar comment
@rdlabo

rdlabo commented Aug 24, 2026

Copy link
Copy Markdown
Contributor Author

/update-screenshots

@github-actions

Copy link
Copy Markdown
Contributor

❌ Failed to update screenshots.

Please check the workflow run for details.

@github-actions

Copy link
Copy Markdown
Contributor

📊 Ionic 9 Playwright Test Report

View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios26/pr-124/

Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run.

github-actions Bot added a commit that referenced this pull request Aug 24, 2026
@github-actions

Copy link
Copy Markdown
Contributor

❌ Failed to update screenshots.

Please check the workflow run for details.

@rdlabo
rdlabo force-pushed the feat/ios-outline-inputs branch from 0514f94 to fe737f4 Compare August 24, 2026 03:57
@rdlabo

rdlabo commented Aug 24, 2026

Copy link
Copy Markdown
Contributor Author

/update-screenshots

@github-actions

Copy link
Copy Markdown
Contributor

📊 Ionic 9 Playwright Test Report

View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios26/pr-124/

Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run.

github-actions Bot added a commit that referenced this pull request Aug 24, 2026
@github-actions

Copy link
Copy Markdown
Contributor

✅ Screenshots have been updated successfully!

The new screenshots have been committed to this PR.

@github-actions

Copy link
Copy Markdown
Contributor

📊 Ionic 9 Playwright Test Report

View the detailed Ionic 9 report: https://rdlabo-dev.github.io/ionic-theme-ios26/pr-124/

Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run.

github-actions Bot added a commit that referenced this pull request Aug 24, 2026
@rdlabo
rdlabo merged commit 649cd0f into main Aug 24, 2026
10 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