sassで直前の親のクラスだけ引き継ぎたい場合

子セレクタに直前の親のクラスだけ継承し、下記のようにしたいのですが

css
1.foo.bar.bar_hoge {
2  color: red;
3}

下記だとどちらも意図とは異なってしまいます。
どうすれば実現できるでしょうか？

##案１

scss
1.foo {
2  &.bar {
3    &_hoge {
4      color: red;
5    }
6  }
7}

css
1.foo.bar_hoge {
2  color: red;
3}

##案２

scss
1.foo {
2  $parent: &;
3  &.bar {
4    &#{$parent}_hoge {
5      color: red;
6    }
7  }
8}

css
1.foo.bar.foo.bar_hoge {
2  color: red;
3}

行動規範の内容に同意します

あなたの回答

tips

プレビュー

行動規範の内容に同意します

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

まだ回答がついていません

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう！

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

関連した質問