Closed ckj closed 6 years ago
I was all for it until I discovered that you need to inline the SVG into the dom tree if you want to color it :(
Leaving this here. That might be better than what I was trying: https://github.com/kisenka/svg-sprite-loader
reviving this because we should do it soon!
To the best of my knowledge, there are two reasonable ways to do this client-side:
<use>
with an SVG sprite utility like @mitsuhiko mentioned. Off the top of the dome it seems like <use>
would be the better way to go. I haven't been able to get it working reliably in the past for support reasons, but noticed Mapbox currently uses it on their dashboard, and was able to change the color and size of the icons in both chrome and safari using only css so perhaps things have gotten better.
The only downside to <use>
is that we lose the ability to change svgs based on prop types, but as @ckj and I have discussed this is maybe a power we don't want anyways, as it would involve changing the SVGs after rendering them from Sketch.
Closing this as I added it and it works great. You can see the nitty gritty here (https://github.com/getsentry/sentry/pull/6764) and here (https://github.com/getsentry/sentry/pull/6843)
In addition to the reasons listed in the following posts, from a maintenance and visibility perspective, we'd benefit from the ease of just being able to drop icons in a folder.
http://blog.cloudfour.com/seriously-dont-use-icon-fonts/ https://speakerdeck.com/ninjanails/death-to-icon-fonts https://github.com/blog/2112-delivering-octicons-with-svg