SASS Mixin：クラスがリンク上にある場合にのみホバースタイルを適用しますか？

Question

mixinを使用して背景色の束を設定しようとしています。私はまた、クラスはlink要素に割り当てられている場合、これらの背景色にホバースタイルを適用したいと思います：我々は平野のdivに.bg-blueを持っている場合

@mixin bg-color($color) { 
    background-color: $color; 
    &[ifthisisalink] { 
    &:hover { 
     background-color: darken($color, 10%); 
    } 
    } 
} 

    .bg-blue { 
     @include bg-color(blue); 
    } 

だから、何のホバー色はありません。

<div class="bg-blue">Hover on me and nothing happens.</div> 
<a href="#" class="bg-blue">Hover on me and I go darker.</a> 

はSASSで、このことが可能です：.bg-blueがリンク上にある場合でも、ホバー色はありますか？

Answer 1

あなたは@at-rootが必要です

@mixin bg-color($color) { 


background-color: $color; 
    @at-root { 
     a#{&} { 
      &:hover { 
      background-color: darken($color, 10%); 
      } 
     } 
    } 
} 

.bg-blue { 
    @include bg-color(blue); 
}