Как объявить два класса для элемента с scss

Question

У меня есть этот код scss:

button.green{
  background-color: $green;
  .current {
    color: $white;
  }
}

Я хочу применить два класса к моей кнопке <button class="green current"></button>, но мой код scss просто не работает.Как бы вы исправить это надлежащим образом scss?

Также попытался без удачи:

button {
  .green{
    background-color: $green;
  }
  & .current {
    color: $white;
  }
}

Answer 1

Почти правильно, пропущено "&" в вашей вложенности для подключения button.green и .current.

Вывод css вашего scss:

button.green > .current

означает, что вы стилизуетеэлемент "current" в его родительском "button.green".

Правильно:

button.green{
  background-color: $green;
  &.current {
    color: $white;
  }
}

Какой вывод:

button.green.current

Answer 2

.green.current {
     background-color: $green;
     color: $white;
}

Это будет применяться как класс !!