You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
The Problem
Our current solution for creating icons from box shadows creates a very large css output especially in regards to duplicating essentially the same box-shadow for each of the 4 sizes we offer.
A Solution
Optimize the css output so there is only one box shadow specified for each icon regardless of size. I found a way to ensure that icons are scalable utilizing em sizing instead of px sizes which will allow us to compile one box-shadow (2 if you count -moz) per icon and just adjust the size of elements as necessary. I've created a POC here which shows how easy it is to make icons any size we want. This is dependent on the font-size property but since all our icons are in pseudo (::before or ::after) elements that wont be a factor.
I will create a PR for this later tonight so it can be tested more throughly. Since there are currently 4 sizes for each icon I'm expecting this change to allow the size of the compiled css of icons to be 1/3 or 1/4 of the current size 😄
The text was updated successfully, but these errors were encountered:
The Problem
Our current solution for creating icons from box shadows creates a very large css output especially in regards to duplicating essentially the same
box-shadow
for each of the 4 sizes we offer.A Solution
Optimize the css output so there is only one box shadow specified for each icon regardless of size. I found a way to ensure that icons are scalable utilizing
em
sizing instead ofpx
sizes which will allow us to compile one box-shadow (2 if you count-moz
) per icon and just adjust the size of elements as necessary. I've created a POC here which shows how easy it is to make icons any size we want. This is dependent on thefont-size
property but since all our icons are in pseudo (::before
or::after
) elements that wont be a factor.I will create a PR for this later tonight so it can be tested more throughly. Since there are currently 4 sizes for each icon I'm expecting this change to allow the size of the compiled css of icons to be 1/3 or 1/4 of the current size 😄
The text was updated successfully, but these errors were encountered: