feat(input): update input styles for SHINE - #2070
Merged
Merged
Conversation
🦋 Changeset detectedLatest commit: 529c431 The changes in this PR will be included in the next version bump. Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
✅ Deploy Preview for stacks-svelte ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
✅ Deploy Preview for stacks ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
…into sal/SPARK-68
This reverts commit 5850d2a.
* Various input sizing, layout, docs tweaks * Fix sm, lg w-axis padding
mukunku
marked this pull request as ready for review
November 26, 2025 20:29
dancormier
approved these changes
Dec 1, 2025
dancormier
left a comment
dancormier
left a comment
Contributor
There was a problem hiding this comment.
Looks good! 😎 Thanks @mukunku
dancormier
previously requested changes
Dec 1, 2025
dancormier
left a comment
dancormier
left a comment
Contributor
There was a problem hiding this comment.
@mukunku I was reminded of a couple of minor updates we should make while reviewing the textarea PR. Once these changes are made, you should be all good to merge:
- Remove
optional,i18nOptionalTextprops from Svelte component- @giamir confirming: we don't need these props anymore since we have similar
requiredprops, right?
- @giamir confirming: we don't need these props anymore since we have similar
- Add
"new": trueforInputsin navigation.json
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR makes some small tweaks to update input components to match the new designs.
I also took a look at the expanding input svelte component and it didn't look like it needed any changes to me. I tried adding more size variations but ended up deciding it wasn't worth it.
Webkit Overrides
I removed all the webkit specific css overrides as in my testing they don't seem to be needed anymore on modern IOS Safari. I tested it on my Iphone 14 using the PR environment; screenshots are below.
Iphone 14 Test Screenshots📱
Before Screenshots
After Screenshots
Breaking changes
Following sizes have been removed:
s-input__mds-input__xlOut of Scope
Text Area is out of scope for this PR. I have a separate PR for it here: #2077
How to Test
Take a look the Input styles in Stacks Docs and Stacks Svelte: