活性化時にサイドメニューのitem-iconの色をイオンで変更します

Question

Ionicアプリでは、サイドメニューの背景色を赤に変更する必要があります。デフォルトでは、アイテムをクリックしたり押したりすると、安定した色が背景色になりますが、赤になる必要があります。

あなたが<ion-content class="dark">

のように背景色を設定するには、カスタムCSSを与えることができます

Answer 1

を参照のCss

.dark { 
    background-color: red !important; 
    color: #ffffff; 
} 

サンプルHTML

<ion-side-menu side="left"> 
     <ion-header-bar class="bar bar-dark"> 
      <h1 class="title">Left Menu</h1> 
     </ion-header-bar> 
     <ion-content class="dark"> 
      <ion-list class="list"> 
      <ion-item href="#/event/check-in">Check-in</ion-item> 
      <ion-item href="#/event/attendees">Attendees</ion-item> 
      </ion-list> 
     </ion-content> 
</ion-side-menu> 

また、適切なコメントがcodpenに完全なコード/デモを確認することができます。http://codepen.io/mhartington/pen/qafgv

他の参考のために、あなたもこれを確認することができます：http://pointdeveloper.com/ionic-change-side-menu-color/

Answer 2

ionic.css custumizedあなた自身を構築するためにsassを使用することができ、この

Answer 3

は中item.active.item-stableとitem.activated.item-stableスタイルをオーバーライドしてくださいあなたのカスタムCSS。

は、カスタムCSSでスタイルの下に追加します。

.item.active.item-stable, .item.activated.item-stable, .item-complex.active .item-content.item-stable, .item-complex.activated .item-content.item-stable, .item .item-content.active.item-stable, .item .item-content.activated.item-stable{ 
    border-color: #B81D22; 
    background-color: #B81D22; 
}