search

mozilla / webmaker-addons

Prototypes for add-ons. Gateways from browser to Webmaker.
http://mozilla.github.io/webmaker-addons/
4 stars 2 forks source link

SVG files in img and css background URLs don't inherit from parent stylesheets #27

Closed toolness closed 9 years ago

toolness commented 9 years ago

What this means for us is that when there's <text font-family="FontAwesome"> in an SVG, the embedding HTML page isn't consulted for that font, so any glyphs using the font don't show up as intended unless the user has the font installed globally on their filesystem.

For instance, this is what src/icons/TrashIcon.svg looks like when embedded in reference.html on my system, which doesn't have Font Awesome installed at the OS level:

capture

One possibility might be to figure out how to link to a CSS stylesheet in the SVG file itself, if that's even possible, but I'm not a huge fan of that because it makes the SVG non-portable if the URL isn't absolute. It would probably be easiest to just tell Sketch/Illustrator to vectorize text when exporting, though it will result in larger SVG files.

xmatthewx commented 9 years ago

Ack. My mistake. We should definitely vectorize. Maybe Ricardo or Jess can lend a hand for Friday.

xmatthewx commented 9 years ago

This is covered by #29, correct?