SASS - クラスがアクティブになっているとき - 別のものを変更する

Question

私のSASSファイルには、滑らかなカルーセルとローディングスピナーのスタイリングがあります。

クラスslick-initializedが表示されている場合は、display:noneをスピナーに設定することができます。

たとえば - から：

slick.slick-initialized { 
    display: block; 
} 

に何かのように：私が持っている

slick.slick-initialized { 
     display: block; 

     &.spinner { display none }; 
} 

：.spinner要素が.slick要素の直後に配置されて

<div class="row"> 

     <div class="spinner"></div> 

     <slick init-onload=true data="qNew" dots=true arrows=false> 
     <div class=“tile" ng-repeat="question in questionsNew"> 
      <span ng-bind-html="question.question"></span> 
     </div> 
     </slick> 

</div> 

Answer 1

場合

あなたはSCSS

SCSS

slick.slick-initialized { 
      display: block; 
      + .spinner { display none }; 
    } 

HTML

<div class="row">  

     <slick init-onload=true data="qNew" dots=true arrows=false> 
     <div class=“tile" ng-repeat="question in questionsNew"> 
      <span ng-bind-html="question.question"></span> 
     </div> 
     </slick> 
    <div class="spinner"></div> 

</div> 

場所を書くことができます。 .spinner element after slick要素と上記のscss