@Evtera

Как правильно записать вложенность в scss?

Здравствуйте. Есть запись вида

select {

  /* when select open add class OPEN */
  &.open {
    z-index: 2;
    .select__dropdown {
      display: block;
      background-color: white;
    }

    .select__label {
      border-bottom: none;
    }

    .select__arrow {
      transition: 0.3s ease;
      transform: rotate(180deg);
    }
  }  
}


Как можно правильно заменить префиксы .select__ , используя вложенность и знак & в данном случае?
  • Вопрос задан
  • 94 просмотра
Решения вопроса 1
inkShio
@inkShio
можешь сделать переменную и просто ее подставлять

$self: "select";

.#{$self} {
  &.open {
    z-index: 2;
    .#{$self}__dropdown {
      display: block;
      background-color: white;
    }

    .#{$self}__label {
      border-bottom: none;
    }

    .#{$self}__arrow {
      transition: 0.3s ease;
      transform: rotate(180deg);
    }
  }
}


Или вот тебе еще один вариант

.select {
  &.open {
    z-index: 2;
  }

  &.open &__dropdown {
    display: block;
    background-color: white;
  }

  &.open &__label {
    border-bottom: none;
  }

  &.open &__arrow {
    transition: 0.3s ease;
    transform: rotate(180deg);
  }
}
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

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