Повторите CSS Стиль каждого N-го элемента - PullRequest
Новая
       6

Повторите CSS Стиль каждого N-го элемента

1 голос
/ 04 февраля 2020

Я форматирую цвет моих направляющих линий отступа Atom.

Стили Atom находятся в CSS, но я не могу понять, как повторить шаблон.

Вот как это выглядит в данный момент:

enter image description here

А это мой код: 

.editor {

  .indent-guide {

      // first level
      color: rgb(255, 140, 0);

      // second level
      &:nth-child(2) {
          color: rgb(138,43,226);
      }

      // third level
      &:nth-child(3) {
          color: rgb(46,139,87);
      }

  }

}

Что отсутствует?

1 Ответ

2 голосов
/ 04 февраля 2020

повтор отсутствует: вы нацелены только на 2 nd и 3 rd child, как исключение из первого правила, которое применяется ко всем .indent-guide элементам.

Используется вместо 3n + 1 и 3n + 2

.editor {

  .indent-guide {

      // first level
      color: rgb(255, 140, 0);

      // second level
      &:nth-child(3n + 1) {
          color: rgb(138,43,226);
      }

      // third level
      &:nth-child(3n + 2) {
          color: rgb(46,139,87);
      }

  }

}
...