イオンチェックボックス内のチェックマークの色を変更する

Question

イオンチェックボックス内のチェックマークの色を変更しています。チェックボックスは白い背景を持ち、チェックマークは白ではなく黒であることを確認するために白です。これは私がこれまで

.checkbox-icon::before { 
 
    background-color: white !important; 
 
    
 
} 
 

 
.checkbox-icon::after { 
 
    color: black !important; 
 
}

 <ion-item ng-repeat="list in modal.item.modifier_lists | orderBy: 'ordinal'" 
 
       ng-if="list.modifier_options[0].name"> 
 
     <div ng-if="list.modifier_options.length === 1" 
 
       class="row"> 
 
      <div class="col"> 
 
      <ion-checkbox ng-model="list.modifier_options[0].selected" 
 
          ng-checked="list.modifier_options[0].selected" 
 
          class="button-orange checkbox-stable"> 
 
       <span class="pull-right">{{list.modifier_options[0].name}}</span> 
 
      </ion-checkbox> 
 
      </div> 
 
     </div> 
 
     </ion-item>

Answer 1

私はあなたが実際にそこでここでは明確にするために、チェックマークの色

を調整するborder-colorを使用する必要があります確信して持っているものであることは、あなたが何ができるかです：

あなたの<ion-checkbox>の中にあなた自身のカスタムクラスを追加してcustom-checkboxとし、そのクラスのために以下を実行します：

.custom-checkbox .checkbox-icon:after { 
    border-color: //whatever you like it to be 
} 

これがチェックされると、チェックマークの色が変わります。