Испытание: примеси и портреты

В этом испытании также нужно использовать созданные примеси с шаблонами и трансформировать портреты монстров.

Решение

Решение испытания будет доступно через несколько минут. Используйте его, если возникнут сложности. А пока попытайтесь пройти испытание самостоятельно.

@lime: #01ff70;
@red: #ff4136;
@yellow: #ffdc00;
@fuchsia: #f012be;

.magic(@color) {
  background-color: @color;
}

.magic(rotate; @angle) {
  transform: rotate(@angle);
}

.magic(spin; @color) {
  background-color: spin(@color, 90deg);
}

.magic(reduce; @size) {
  width: @size;
  height: @size;
}

.magic(skew; @angle) {
  transform: skewX(@angle);
}

.monster-1 {
  .magic(rotate; 180deg);
  .magic(@red);
}

.monster-2 {
  .magic(spin; @lime);
}

.monster-3 {
  .magic(reduce; 80px);
  .magic(@yellow);
}

.monster-4 {
  .magic(skew; -5deg);
  .magic(@fuchsia);
}

Притормози, дружище

Проходить вызовы части «Примеси в Less» тренажёра «Инструменты автоматизации: препроцессор» можно после регистрации и оформления подписки.

Зарегистрироваться