Ensure icons are the same dimensions
jaime-lynn opened this issue · comments
🔧 Enhancement Request
All icons should be the same dimensions, regardless of if some if it is occupied by empty space.
Currently, we can run into things like this:
Despite the elements having the same spacing, since the icon for "Details" is smaller than the others, the text ends up out of alignment. This was resolved in the above example with an mr-1 on the icon, but that really shouldn't be necessary. Icons should reliably have the same dimensions.
Who is asking for the feature?
What business problem is this hoping to solve?
Provides consistency.
Estimates
FE - 1
We need to update 2 places until we map the separation of icons.
- the handlebars template in this repo: https://github.com/ritterim/platform-ui/blob/master/templates/css.hbs#L8-L29
- changes in the stand-alone repo need to be added here: https://github.com/ritterim/platform-icons/blob/master/src/utilities/_utilities.scss
once this is implemented the entire team should do a quick look in Platform to test
For QA / Everyone - Let me know if any weird stuff shows up around icons!
@mrtrimble looks like an over-correction?
@JCarver27 - good point! That was the original inspiration for this adjustment lol.
That was "fixed" previously by adding a class to make it line up, but now that the icons are same widths that class can be removed. I can take care of that quick tomorrow!
@JCarver27 that weird icon should now be fixed with @Azbury's PRs
@mrtrimble Looks good. I'm not sure if I should close this or leave it, since it was asked for everybody to keep an eye out for icon type things.
I think it can be closed, I haven't really heard from anyone else. If something comes up, folks can either reach out or create a new issue.