Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(input): add the readonly styles for the ionic theme #29483

Merged
merged 4 commits into from
May 10, 2024

Conversation

brandyscarney
Copy link
Member

@brandyscarney brandyscarney commented May 9, 2024

Issue number: internal


What is the current behavior?

There are no custom styles when readonly is added to an input.

What is the new behavior?

  • Applies an input-readonly class when the readonly property is true
  • Styles the class in the ionic theme to match the design requirements for readonly inputs
  • Adds screenshot tests for the readonly style for an unset fill and "outline" fill

Does this introduce a breaking change?

  • Yes
  • No

Other information

Preview

Copy link

vercel bot commented May 9, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
ionic-framework ✅ Ready (Inspect) Visit Preview 💬 Add feedback May 9, 2024 7:40pm

@github-actions github-actions bot added the package: core @ionic/core package label May 9, 2024
@brandyscarney brandyscarney changed the title Rou 5155 feat(input): add the readonly styles for the ionic theme May 9, 2024
@brandyscarney brandyscarney marked this pull request as ready for review May 9, 2024 20:05
@brandyscarney brandyscarney requested a review from a team as a code owner May 9, 2024 20:05
@brandyscarney brandyscarney requested review from thetaPC and removed request for a team May 9, 2024 20:05
@@ -7,6 +7,8 @@
// --------------------------------------------------

:host {
// TODO(ROU-5477): use design token here when it is added
--color: #121212;
Copy link
Contributor

@thetaPC thetaPC May 9, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Was it verified that it's going to be added? Else we might need to reach out to the designers to verify that this hex is the correct value. Figma has inconsistency for the value, it says #121212 / Neutral/Neutrals 900 but --ionic-color-neutral-900 value does not match.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes I have verified that the design tokens for state have yet to be added. I actually asked about this specific hex before because I ran into it in other components. They are planned in ROU-4870 which is linked as a blocker to the ticket I added here.

Base automatically changed from fix-input-shape-underline to ROU-4848 May 10, 2024 14:27
Copy link
Contributor

@thetaPC thetaPC left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@brandyscarney brandyscarney merged commit 09935fd into ROU-4848 May 10, 2024
49 of 50 checks passed
@brandyscarney brandyscarney deleted the ROU-5155 branch May 10, 2024 15:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
package: core @ionic/core package
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants