SASS Feature Suggestion: Data URL Helper

[Jacques Crocker]

Hi. In doing some iPhone web app development, I started using a lot of
Inline CSS Images via data urls in order to avoid the http requests on
lots of small icons.
http://en.wikipedia.org/wiki/Data:_URI_scheme

I've just been using DataURLMaker (http://www.sveinbjorn.org/
dataurlmaker) to generate the images, however was wondering if SASS
could provide some helpers to make this process a bit easier to
manage.

Maybe something like:

.icon
background-image: url(#{data_image('/images/icon.png')})

Or maybe it would work better as a mixin

.icon
+inline-background('/images/icon.png')

Would love any suggestions on how to get this implemented (I'm sure
Sass is currently extensible enough to allow it). Also, maybe it would
be a good future feature for the library itself to provide a built-in
way to generate data urls.

Thanks

[Chris Eppstein]

Compass already provides the inline_image() function that does this.

.icon
 background-image= inline_image("icon.png")

It even knows you keep your images in /images assuming you've configured the images_dir configuration property.

Chris

[Jacques Crocker]

Very cool... dunno how I missed that

Work for me! Thanks Chris

[Charles Roper]

On 15/10/2009 22:18, Chris Eppstein wrote:
> Compass already provides the inline_image() function that does this.

Hey Chris, is this documented anywhere? I'm keen to have a trawl through
the docs to find little gems like this.

Charles

[Chris Eppstein]

Documentation? Hmm. I think the best docs for that are in the changelog.

http://github.com/chriseppstein/compass/blob/master/CHANGELOG.markdown

Sorry. someday we'll have docs.