Support the ability to change the default icon size in React

[wenchonglee]

Hi, wondering if the point raised in this discussion can be supported? 😅 (Through a context or some other ways?)

Discussed in https://github.com/tabler/tabler-icons/discussions/577

^{Originally posted by **wenchonglee** March 21, 2023} Hey, Is there a good way to change the default size of icons, say from 24px to 20px? Initially I opted to use something like below, but it will override every instance; causing changes to the `size` prop to not work. ```css svg.tabler-icon { width: 20px; height: 20px; } ``` ```js // will be 20px even with the size prop, because the css overrides it ```

[giubatt]

would be nice if the default size was 1em instead as well

[tx46]

this makes the icon library pretty much unusable for us. we want all icons to be of size 18, but some have to be custom size and that seems to be absolutely impossible right now..?

[giubatt]

what we ended up doing is patching the library with pnpm in our project, which actually works pretty well because there are not many places that need changing

[tx46]

@giubatt can you show a diff of your patch?

[tx46]

what can be done to mitigate this? this basically makes it unusable in any real-world ui where you need different sizes. I have to add another lib now or put ridiculous transform scales everywhere, and if I add another lib I might as well throw out tabler. what's up?

[giubatt]

@giubatt can you show a diff of your patch?

@philiparvidsson this is the patch file pnpm generated: https://gist.github.com/giubatt/319cc6a7d8b6c9836575392fa2e11c5c

it's for an older version but I don't imagine anything changed in those files since then

I would just do this instead of adding another library to handle it, I faced the same dilemma when we started using tabler If you use yarn or pnpm they have this built-in, otherwise you can use patch-package