Sass для циклов отображается на CSS, но не отображается в браузере - PullRequest
Новая
       2

Sass для циклов отображается на CSS, но не отображается в браузере

0 голосов
/ 07 февраля 2020

У меня есть sass для l oop, который я хочу использовать для изменения стиля в ячейках таблицы. Это сопоставление с моим CSS, но не отображается в моем браузере. Моя таблица стилей CSS связана с моей HTML, и она работает. Может кто-нибудь дать мне совет, почему он не работает? Если я вставлю код вручную, он будет работать.

S CSS: 

@for $i from 6 through 11 {
        th:nth-child(#{$i}) {
            height: 30px;
            width: 150px;

            input {
                background-color: color(section);
                border: none;
                color: color(primary-text);
                font-size: 14px;
                font-family: 'Nunito', sans-serif;
            }
        }
    }

CSS: 

table tr:nth-child(2) th:nth-child(6) {
  height: 30px;
  width: 150px;
}

table tr:nth-child(2) th:nth-child(6) input {
  background-color: #161616;
  border: none;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-family: 'Nunito', sans-serif;
}

table tr:nth-child(2) th:nth-child(7) {
  height: 30px;
  width: 150px;
}

table tr:nth-child(2) th:nth-child(7) input {
  background-color: #161616;
  border: none;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-family: 'Nunito', sans-serif;
}

table tr:nth-child(2) th:nth-child(8) {
  height: 30px;
  width: 150px;
}

table tr:nth-child(2) th:nth-child(8) input {
  background-color: #161616;
  border: none;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-family: 'Nunito', sans-serif;
}

table tr:nth-child(2) th:nth-child(9) {
  height: 30px;
  width: 150px;
}

table tr:nth-child(2) th:nth-child(9) input {
  background-color: #161616;
  border: none;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-family: 'Nunito', sans-serif;
}

table tr:nth-child(2) th:nth-child(10) {
  height: 30px;
  width: 150px;
}

table tr:nth-child(2) th:nth-child(10) input {
  background-color: #161616;
  border: none;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-family: 'Nunito', sans-serif;
}

table tr:nth-child(2) th:nth-child(11) {
  height: 30px;
  width: 150px;
}

table tr:nth-child(2) th:nth-child(11) input {
  background-color: #161616;
  border: none;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-family: 'Nunito', sans-serif;
}
...