Add woff data uri to generated CSS + template helper

[jvatic]

No description provided.

[kuon]

I have the same problem as @markbrown4 it seems the data URI is not quoted properly, causing SCSS error.

Invalid CSS after "...  font-url(data": expected comma, was ":application/x-..."

[jvatic]

@markbrown4, @kuon what version of sass are you using? This is working fine for me with versions 3.4.5 and 3.4.6.

@markbrown4 The data-uri improves user experience through the icon font loading at the same time as other styles instead of a bit after. The regular url is included for browsers that don't support the data-uri but support woff. If you're worried about the added overhead you could load the font in a separate css file without loosing the benefits of the data-uri. It's possible to remove the data-uri if you don't want it by using a custom template.

[kuon]

I'm using sass 3.2.19, but I'll see if I can upgrade.

[kuon]

Actually I can't upgrade, because sass-rails requires sass 3.2.x.

[markbrown4]

I've tried with 3.4.5 and 3.4.6 and no dice yet, using the latest sass-rails and compass.

@jvatic I believe the font-url helper is the compass method and only accepts a path to a file.
http://compass-style.org/reference/compass/helpers/urls/#font-url

When you compile the css file does it output font-url() or url()?

[jvatic]

@markbrown4 Sorry to hear that. I don't think font-url is isolated to compass, but this should really be configurable in the yaml (OSS FTW 😉).

[ghost]

The woff data uri breaks functionality in IE8 and is NOT a "bulletproof" solution which is shown in the "FontSpring's Bulletproof @font-face syntax"-link mentioned in the manual.