Как задать имя класса спрайта в compass?

Question

[Kirill Popolov]

Здравствуйте.

Генерирую спрайты посредством compass:

$icons-sprite-base-class: ".icon";
$icons-spacing: 5px;
$icons-sprite-dimensions: true;
$icons-layout: smart;
@import "icons/*.png";

@include all-icons-sprites;

В итоге имя класса каждого изображения выглядит так: .icons-close
Как задать имя класса .icon-close, не переименовывая папку с изображениями?

Answer 1

[omo]

Вы можете использовать для спрайта такую запись:

$icons : sprite-map('img/icons/*.png', $spacing: 5px, $layout: smart);

И вызывать его в нужном месте так:

.icons { background: sprite($icons, icon-name) no-repeat; }
.icons.facebook { @include sprite($icons, icon-facebook); }

Вторая запись задает только background-position, т.е. для элемента уже должен быть определен спрайт-бэкграунд (удобно когда много однотипных элеметов с разными иконками через @each перебирать).
Подробнее здесь compass-style.org/reference/compass/helpers/sprites

Comments

[Kirill Popolov]

Про такую запись я знаю. Меня интересовал именно импорт с автоматической генерацией селекторов. Спасибо.