fix: remove hardcoded font-size from SvgIcon to allow responsive parent sizing#4069
Conversation
|
Hi team, I'm an external contributor and would appreciate if a maintainer could endorse this PR to allow the CI checks to run. Happy to make any adjustments needed. Thank you! |
|
Hi! Thanks for contributing. Not to be rude but I see the Github account associated with this use is only 3 days old. Is there actually a human being associated with this account or is this being opened by an agent or bot? |
jack-ryan-nava-pbc
left a comment
There was a problem hiding this comment.
I think the dependency changes are out of scope for this fix. Please revert those changes.
| "@storybook/react": "8.6.17", | ||
| "@storybook/react-webpack5": "8.6.17", | ||
| "@storybook/theming": "8.6.1", | ||
| "@testing-library/dom": "^10.4.1", |
There was a problem hiding this comment.
Why did you update this dependency?
| "webpack-bundle-analyzer": "^4.10.2", | ||
| "webpack-stream": "^7.0.0", | ||
| "yargs": "^17.7.2" | ||
| }, |
There was a problem hiding this comment.
Why are these dependencies updated?
Hi, Firstly Thanks for the Review comments. Yes you got a valid question here, i can totally understand :), Nothing much to worry here- I am a Human with nearly 15 years of IT Experience, I have created this account with my new gmail recently. I can assure this account will be consistent from now on. Happy to Contribute. |
|
Thanks for the review! These dependency changes were unintentional — |
|
not a wolf |
|
@ravitejapioneerblaze-code can you resolve the conflicts? |
6ad5dbf to
6c5a435
Compare
|
Conflicts resolved and branch updated with upstream main. Thank you! |
Summary
Removed hardcoded
font-size: var(--font-size-base)from the.ds-c-iconclass so SVG icons scale responsively with theirparent container's font-size instead of being fixed at the base size.
Problem
The
font-sizeproperty on.ds-c-iconwas overriding the parentcontainer's font-size, preventing icons from growing or shrinking
based on button size (e.g. small vs large buttons on mobile/desktop).
Solution
Removed
font-size: var(--font-size-base)from_SvgIcon.scss.Icons now inherit font-size from their parent container, making
them fully responsive.
Changes
font-sizefrom.ds-c-iconin_SvgIcon.scssSvgIcon.test.tsxto verify:Testing
References