slider'ının noktası daaaaa beyaz olmuyormuş amannn amaannnn

Bu aralar ionic'i Hangi Film? adındaki oyunumu yazmak için kullanıyorum ve pek fazla ion tag'li dom elemanlarına ihtiyacım olmadı daha çok div'lerle olayı customized bir şekilde götürüyorum. Ama oyunun instructions yani nasıl oynandığı ne olduğuyla ilgili birşeyleri ilk kullanım sırasında göstermek istediğimde bir ion-slide-box kullanayım dedim. Gerçekten 2 dakikada çalışan bir slide-box (ios'taki ismiyle pagecontrol) mekanizmam oldu süper. Çalıştırırken sadece kayan sayfalar için height:100% sorunu yaşadım onu da ion-slide-box için bir css class tanımlayarak width, height 100% verdim çalıştı. Şimdi gelelim küçük makalemizin konusuna. Arkaplan resmim koyu bir resim o yüzden slide-box'ın sayfalar için aşağısına koydu noktaları beyaz yapmak istedim. Forumlarda bu konuyla ilgili çok sayıda post var. Buyur abicim çalışan kod.

<ion-slide-box class="view-instructions-slide-box slider-pager-page">
   <ion-slide class="slider-pager-page">
      <div class="view-instructions-page-red">
         red
      </div>
   </ion-slide>
   <ion-slide class="slider-pager-page">
      <div class="view-instructions-page-green">
         green
      </div>
   </ion-slide>
   <ion-slide class="slider-pager-page">
      <div class="view-instructions-page-blue">
         blue
      </div>
   </ion-slide>
</ion-slide-box>

Aha bunlar da css sınıfları

.view-instructions-slide-box {
    width: 100%;
    height: 100%;
}

.view-instructions-page-red {
    display: inline-block;
    width: 100%;
    height: 100%;
    margin: auto;
    background-color: red;
}

.view-instructions-page-green {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    background-color: green;
}

.view-instructions-page-blue {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    background-color: blue;
}

.slider-pager-page {
  color: white !important;
}

.slider-pager-page.active {
  color: white !important;
}

ve sonuç