snaha / diete.design

https://diete.design
MIT License
0 stars 0 forks source link

Small text with icon is broken in a flex container #342

Closed agazso closed 1 month ago

agazso commented 3 months ago

When putting a Typography component with variant small in a flex container and using an icon of size 16, the vertical alignment of the text is broken.

I tried out using different elements but that does not make a difference.

Reproducible example: https://github.com/snaha-net/diete.design/pull/341

gnome-shell-screenshot-3qj0q5

agazso commented 3 months ago

Workaround: wrap the icon and Typography in a span element which has display: inherit.

This could also work as a solution, by adding display: inherit to the .root class of the Typography component.