Change spinner color on pull to refresh


In the <ion-refresher> we can set a custom spinner with spinner="spiral" for example but is there a way to change its color because spinner="spiral-calm" doesn’t seem to work ?


This should work:

<ion-spinner icon="spiral" class="spinner-calm"></ion-spinner>

More information:

I wasn’t clear, I want to do that :

<ion-refresher on-refresh="gradeVm.doRefresh()"

But it’s only working with:

<ion-refresher on-refresh="gradeVm.doRefresh()"

In that case it’s possible to style the spinner with CSS.

.spinner svg {
  stroke: $calm;
  fill: $calm;

Replace $calm with #11c1f3 if you don’t use SCSS.

Thanks it’s working, it’s weird with spiral but it works :smile:

The weird part is that it’s working with the pulling-icon :

<ion-refresher on-refresh="gradeVm.doRefresh()"
                   pulling-icon="ion-arrow-down-b positive"

I refer to this documentation but unable to make the dark color default backdrop disappear. My purpose is that the dark background change to same color with background or no color.

${noBackdrop: true, duration: 1800,
template: ’
My Label’