Permalink
Browse files

Added `sprite-replace-text` mixin for replicating the `replace-text-w…

…ith-dimensions` mixin using sprites.
  • Loading branch information...
1 parent 1dd2563 commit 7f89d6685d6d9d51578437c96084adf0c0593d1b @ultimatedelman committed Sep 26, 2011
Showing with 12 additions and 0 deletions.
  1. +12 −0 frameworks/compass/stylesheets/compass/utilities/sprites/_base.scss
@@ -63,4 +63,16 @@ $disable-magic-sprite-selectors:false !default;
}
}
}
+}
+
+// Similar to 'replace-text-with-dimensions' but with sprites
+// To use, create your sprite and then pass it in the `$map` param
+// The name of the image in the sprite folder should be `$img-name`
+
+@mixin sprite-replace-text ($map, $img-name){
+ @include hide-text;
+ background: sprite($map, $img-name) no-repeat;
+ display: block;
@heygrady

heygrady Sep 28, 2011

Please don't include display block in this mixin. It's common to use replace-text-with-dimensions with an inline block element.

+ width: image-width(sprite-file($map, $img-name));
+ height: image-height(sprite-file($map, $img-name));
}

0 comments on commit 7f89d66

Please sign in to comment.