/*
 * Image sprite for elements module
 */

@import "compass/utilities/sprites/base";

// General Sprite Defaults
// You can override them before you import this file.
$elements-sprite-base-class: ".elements-sprite" !default;
$elements-sprite-dimensions: false !default;
$elements-sprites: sprite-map(
  "sprites/elements/*.png",
  $position:                                  0%,
  $spacing:                                   0,
  $repeat:                                    no-repeat,
  $readonly-spacing:                          0,
  $elements-question-spacing:                 10px,
  $elements-image_color-spacing:              5px,
  $elements-image_fill-spacing:               15px,
  $elements-custom_text_combo_icons-spacing:  10px
);

// All sprites should extend this class
// The elements-sprite mixin will do so for you.
#{$elements-sprite-base-class} {
  background: $elements-sprites no-repeat;
}

// Use this to set the dimensions of an element
// based on the size of the original image.
@mixin elements-sprite-dimensions($name) {
  @include sprite-dimensions($elements-sprites, $name);
}

// Move the background position to display the sprite.
@mixin elements-sprite-position($name, $offset-x: 0, $offset-y: 0) {
  @include sprite-position($elements-sprites, $name, $offset-x, $offset-y);
}

// Extends the sprite base class and set the background position for the desired sprite.
// It will also apply the image dimensions if $dimensions is true.
@mixin elements-sprite($name, $dimensions: $elements-sprite-dimensions, $offset-x: 0, $offset-y: 0) {
  @extend #{$elements-sprite-base-class};

  @include sprite($elements-sprites, $name, $dimensions, $offset-x, $offset-y);
}

@mixin elements-sprites($sprite-names, $dimensions: $elements-sprite-dimensions, $prefix: sprite-map-name($elements-sprites)) {
  @include sprites($elements-sprites, $sprite-names, $elements-sprite-base-class, $dimensions, $prefix);
}

// Generates a class for each sprited image.
@mixin all-elements-sprites($dimensions: $elements-sprite-dimensions, $prefix: sprite-map-name($elements-sprites)) {
  @include elements-sprites(favorite important photos readonly symbolic-link system unreadable, $dimensions, $prefix);
}