Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Compass sprites generate placeholders instead of classes (newer version doesn't require listfiles.rb)
$disable-magic-sprite-selectors: true;
$icons-inline: true;
$icons-sprite-base-class: "%icons-sprite";
$icons-layout: smart;
$icons: sprite-map("icons/*.png");
@import "icons/*.png";
@each $img in sprite-names($icons) {
%icon-#{$img} {
@extend %icons-sprite;
@include icons-sprite-dimensions($img);
@include icons-sprite-position($img);
}
}
@taotsu

This comment has been minimized.

Copy link

@taotsu taotsu commented Jan 31, 2014

Thanx for this one!! I have added a version with HiDPI support.

@morewry

This comment has been minimized.

Copy link
Owner Author

@morewry morewry commented Feb 19, 2014

You're welcome, and thank you too! That will come in handy.

@morewry

This comment has been minimized.

Copy link
Owner Author

@morewry morewry commented Mar 11, 2014

I also created a version with retina/2x support

Unfortunately, the simplest way and most transparent way to add support requires a class be used for the base class instead of a placeholder. However, the rules for that placeholder would be output in any event as soon as a single icon was utilized, so this doesn't create clutter in generated CSS.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.