Есть ли способ сгруппировать селекторы в SASS?

Question

Например, если бы у меня было несколько ссылок, и я хотел бы сделать некоторые ссылки зелеными и красными при наведении курсора или щелчке.

Вместо того, чтобы делать:

.links a {
 color: green;
}

.links a:visited {
 color: green;
}

.links a:hover {
 color: red;
}

.links a:active {
 color: red;
}

<div class="links">
  <a href="#">Link 1</a>
  <a href="#">Link 1</a>
</div>

Что я мог сделать?

Я пробовал использовать .links a:hover, a:active{} и .links a,a:visited{}, однако это привело к другим ссылкам, использующим цвет в этом rule.

Если это актуально, я использую bootstrap 4 с sass.

Answer 1

Я считаю, что с SASS (в отличие от S CSS) это будет

.links   
  & a, a:visited 
    color: green 
  & a:hover, a.active
    color: red

после компиляции:

.links a, .links a:visited {
  color: green;
}
.links a:hover, .links a.active {
  color: red;
}

S CSS версия

.links {
  & a, a:visited {
    color: green;
  }
  & a:hover,  a.active {
    color: red;
  }
}