クラスベースの条件SCSS/SASS

Question

祖先クラスに基づいて色を変更したいと思います。 私はCSSで取得したい：

section.container-story .story-head .content h2 { 
    color:#FF0000; 
} 
section.container-story.category_1 .story-head .content h2 { 
    color:#00FF00; 
} 

マイSCSSコード

section.container-story{ 

    $story-color: #FF0000; 

    .story-head{ 

     .content{ 

      h2{ 
       color: $story-color; 

       .category_1 &{ 
        color: #00FF00; 
       } 
      } 
     } 
    } 
} 

は、これを達成する方法はありますか？ここで

は、私以外の作業ペンです：https://codepen.io/will83/pen/pwNzzQ

は

Answer 1

単に&文字を使用していただきありがとうございます。

$story-color: #FF0000; 

.story-head{ 
    .content{ 
    h2{ 
     section.container-story &{ 
     color: $story-color; 
     } 
     section.container-story.category_1 &{ 
     color: #00FF00; 
     } 
    } 
    } 
}