werty1001
@werty1001
undefined

Возможно ли реализовать подобное в Stylus?

Привет, начал осваивать Stylus и у меня возник вопрос. Возможно ли как-нибудь автоматом собрать все селекторы где есть миксин sp, например в переменную?

$home = 20px 20px 0 0px;
$menu = 12px 12px -222px 0px;
$logo = 120px 120px -122px 0px;

sp($icon)
	width $icon[0]
	height $icon[1]
	background-position $icon[2] $icon[3]

.home
  sp($home)
  
.menu
  sp($menu)
  
.logo
  sp($logo)

Чтобы при компиляции намутить что-то подобное:
.home,
.menu,
.logo {
  background: ...;
}
.home {
  width: 20px;
  height: 20px;
  background-position: 0px 0px;
}
.menu {
  width: 12px;
  height: 12px;
  background-position: -222px 0px;
}
.logo {
  width: 120px;
  height: 120px;
  background-position: -122px 0px;
}
  • Вопрос задан
  • 283 просмотра
Решения вопроса 1
Можно использовать +cache
$home = 20px 20px 0 0px;
$menu = 12px 12px -222px 0px;
$logo = 120px 120px -122px 0px;

sp($icon)
  width $icon[0]
  height $icon[1]
  background-position $icon[2] $icon[3]
  +cache('bg')
   background-image: url('')

.home
  sp($home)
  
.menu
  sp($menu)
  
.logo
  sp($logo)

На выходе получится именно то, как вам нужно.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы