SASS: повтор строки в селекторе

Question

SASS: повтор строки в селекторе

Рейтинг: 0Ответов: 1Опубликовано: 16.11.2014

Требуется реализовать стандартные древовидные комментарии, хочется реализовать примерно такую плюшку на SASS, когда каждый последующий уровень комментариев съезжает меньше предыдущего:

alt text

Пока что понятно, что на CSS это должно выглядеть так:

.class {
    padding-left: 40px;
}
.class .class {
    padding-left: 20px;
}
...
.class .class .class .class .class {
    padding-left: 3px;
}
.class .class .class .class .class .class {
    padding-left: 0;
}

Но я не понимаю, как в sass организовать повторение строки энное количество раз. Гугл по запросу sass string repeat выводит все что угодно, кроме нужного.

css sass

Источник: Stack Overflow на русском

Answer 1

▲ 1Принят

Как всегда, ответ нашелся сразу же

.article-page
  $selector: ""
  $limit: 8
  @for $i from 1 through $limit
    $selector: $selector + ".comments "
    #{$selector}
      padding-left: ($limit - $i) * ($limit - $i) * (40px / ($limit * $limit))

SASS: повтор строки в селекторе

Ответы