【scss】クラス名などを変数にしたい場合:インターポレーション

これもすぐ忘れることなので、忘備録。

$name: foo;
$attr: border;
p.$name {
  $attr-color: blue;
}

↑ これだとダメなのね。
正しくは、

$name: foo;
$attr: border;
p.#{$name} {
  #{$attr}-color: blue;
}

↓ で、こうなる。

p.foo {
  border-color: blue;
}

やったー!