sassの親属性値を取得

Question

私はsassを使用して私のアプリケーションのためのスタイリングのトップレベル<a>を作成しようとしています。サイト全体のリンクのほとんどは緑色なので、これをスタイルにしています。

a { 
    color: green; 

    &:hover { 
    color: darken(green, 10%); 
    } 
} 

を（私はdarken機能のためのコンパスを使用しています）しかし、特定の場合にはリンクがグリーンに点灯していません。このような場合は、テキストの色とホバーの色の両方を指定する必要があります。そうでない場合は、デフォルトで緑色にホバーします。私はこのDRYerを行う方法があるのだろうかと思っています。理想的には、親クラスを色付けすることができます。

a { 
    color: green; 

    &:hover { 
    color: darken(parent(color), 10%); 
    } 
} 

このようにして、ホバーは常に特定の色が何であってもデフォルトになります。これは理にかなっていますか？このようなことは可能でしょうか？そうでない場合、これを処理する最良の方法は何ですか？ Mixin？

ありがとうございます！

Answer 1

私はミックスインを使用したい：

@mixin link($color) { 
    a { color: $color}; 

    &:hover { color: darken($color, 10%) }; 
} 

.foo { 
    @include link(green); 
} 

レンダリングCSS：

.foo a { color: green; } 

.foo a:hover { color: #004d00; } 

Answer 2

あなたが求める何がSASSでは不可能です。 SASSは、すべての要素とプロパティを持つオブジェクトモデルを構築しません（HTMLなしでは不可能です）。

mixinは再利用可能なケースには適していますが、アドホックなケースでは過剰です。あなたはすべての変数を保存する場所を別々の部分に変数を移動することができ

a { 
    $link-color: green; 
    color: $link-color; 

    &:hover { 
    color: darken($link-color, 10%); 
    } 
} 

注：

ちょうど変数を使用します。