Skip to content

fix(input, textarea, select): reduce padding on slotted buttons - #28676

Merged
averyrousseau merged 17 commits into
mainfrom
FW-5645
Dec 13, 2023
Merged

fix(input, textarea, select): reduce padding on slotted buttons#28676
averyrousseau merged 17 commits into
mainfrom
FW-5645

Conversation

@averyrousseau

@averyrousseau averyrousseau commented Dec 8, 2023

Copy link
Copy Markdown
Contributor

Issue number: N/A


What is the current behavior?

Buttons slotted in the start/end slots of input, textarea, or select have a lot of excess padding that can cause them to look misaligned from other pieces such as the control's label, especially when using fill="clear".

What is the new behavior?

Padding removed, and a border radius added so that non-clear buttons as well as the focus state on clear buttons still look okay. Existing screenshot tests have also been updated to include buttons (non-clear ones so you can see the border radius in the screenshots).

Let me know if you think this should go on a feature branch instead. I chose main because the current experience looks somewhat broken and we just did a minor release recently, but this could be considered a notable enough behavior change.

Does this introduce a breaking change?

  • Yes
  • No

Other information

@github-actions github-actions Bot added the package: core @ionic/core package label Dec 8, 2023
@averyrousseau
averyrousseau marked this pull request as ready for review December 8, 2023 19:54
@averyrousseau
averyrousseau requested a review from a team as a code owner December 8, 2023 19:54
@averyrousseau
averyrousseau requested review from a team and sean-perkins and removed request for a team December 8, 2023 19:54
@brandyscarney
brandyscarney self-requested a review December 12, 2023 16:00
Comment thread core/src/components/input/input.scss Outdated
Comment thread core/src/components/input/input.scss Outdated
Comment thread core/src/components/select/select.scss Outdated
Comment thread core/src/components/textarea/textarea.scss Outdated
@averyrousseau
averyrousseau requested review from thetaPC and removed request for sean-perkins December 12, 2023 21:21

@thetaPC thetaPC left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

LGTM

Comment thread core/src/components/input/input.scss Outdated
Comment thread core/src/components/input/input.md.scss
@averyrousseau
averyrousseau added this pull request to the merge queue Dec 13, 2023
Merged via the queue into main with commit 516b844 Dec 13, 2023
@averyrousseau
averyrousseau deleted the FW-5645 branch December 13, 2023 22:59
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.

4 participants