Ändern der Farbe des Häkchens innerhalb der Ion-Checkbox

Question

Ich versuche, die Farbe des Häkchens innerhalb der Ion-Checkbox zu ändern. Das Kontrollkästchen hat einen weißen Hintergrund und das Häkchen ist weiß, damit das Häkchen schwarz und nicht weiß wird. Dies ist, was ich

.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

Ich bin ziemlich sicher, Sie haben tatsächlich border-color zu verwenden, so weit haben Sie das Häkchen Farbe

So anzupassen hier zu klären ist, was Sie tun können:

Innerhalb Ihrer <ion-checkbox> fügen Sie eine benutzerdefinierte Klasse Ihrer eigenen custom-checkbox und dann für diese Klasse tun was ist:

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

Das wird die Farbe des Häkchens ändern, wenn es überprüft wird.