Skip to content
New issue

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

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

Already on GitHub? # to your account

[PLAY-1181] Circle Icon kit: fix sizing error when global spacing props are used #3352

Conversation

ElisaShapiro
Copy link
Contributor

@ElisaShapiro ElisaShapiro commented Apr 10, 2024

What does this PR do? A clear and concise description with your runway ticket url.
PLAY-1181 prevents global spacing props (margin and padding) from altering the size of the circle icon kit by adding size to the classname.

ToDo/Breaking Change consideration:

  • This will add word size on iconcircle kits but the actual size will remain the same. The only thing we need to do is make sure iconcircle kits with size on are not being targeted anywhere in Nitro so we can safely update the classname.
  • One instance found here.

Screenshots: Screenshots to visualize your addition/change
Before (from example CSB): when present, a padding or margin larger than the Icon Circle's prescribed size causes the size to change to the largest prop value.
codesandbox example before
After React:
react examples inspect
After Rails:
rails examples inspect

How to test? Steps to confirm the desired behavior:

  1. Go to code sandbox (will update with link once created with alpha)
  2. Create IconCircle example with any size, plus padding and/or margin of any size.
  3. The resultant IconCircle displaying on the left should display an IconCircle of the indicated size, with a padding and/or margin if given of the correct value. The size of the IconCircle should NOT be altered to the largest size given to any of the size/padding/margin props.

Checklist:

  • LABELS Add a label: enhancement, bug, improvement, new kit, deprecated, or breaking. See Changelog & Labels for details.
  • DEPLOY I have added the milano label to show I'm ready for a review.
  • TESTS I have added test coverage to my code.

@ElisaShapiro ElisaShapiro added bug Fixes to issues discovered in Playbook (USED IN CHANGELOG) alpha labels Apr 10, 2024
@ElisaShapiro ElisaShapiro self-assigned this Apr 10, 2024
Copy link

🎉 Congratulations on creating an Alpha Version!

Your Alpha for Ruby Gems is 13.24.0.pre.alpha.PLAY1181circleiconkitfixsizingerrorglobalspacingprops2675

Your Alpha for NPM is 13.24.0-alpha.PLAY1181circleiconkitfixsizingerrorglobalspacingprops2675

@ElisaShapiro ElisaShapiro marked this pull request as ready for review April 11, 2024 15:05
@ElisaShapiro ElisaShapiro requested review from a team as code owners April 11, 2024 15:05
@ElisaShapiro ElisaShapiro added the milano 20 MAX - Deploy this PR to a review environment via Milano label Apr 11, 2024
Copy link
Contributor

@thestephenmarshall thestephenmarshall left a comment

Choose a reason for hiding this comment

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

I could not find any instances in Nitro where a selector is specifically targeting pb_icon_circle_kit with _size.

@ElisaShapiro
Copy link
Contributor Author

I could not find any instances in Nitro where a selector is specifically targeting pb_icon_circle_kit with _size.

The only thing I could find was this.

@jasperfurniss jasperfurniss added Product Approved pending technical review, OK to merge to master Code Approved Approved by a Playbook Admin labels Apr 12, 2024
@jasperfurniss jasperfurniss added this pull request to the merge queue Apr 12, 2024
Merged via the queue into master with commit 32ce69b Apr 12, 2024
7 checks passed
@jasperfurniss jasperfurniss deleted the PLAY-1181-circle-icon-kit-fix-sizing-error-global-spacing-props branch April 12, 2024 16:09
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
alpha bug Fixes to issues discovered in Playbook (USED IN CHANGELOG) Code Approved Approved by a Playbook Admin milano 20 MAX - Deploy this PR to a review environment via Milano Product Approved pending technical review, OK to merge to master
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants