Urigo / angular-spinkit

SpinKit (http://tobiasahlin.com/spinkit/) spinners for AngularJS

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Add Color Options

andrewmunsell opened this issue · comments

It would be great to have the ability to specify a color for the spinner, even if it were a simple subset of colors (e.g. black, white).

@andrewmunsell I think it is better to do it in css no?

Yes, here is how I did it:

.wave-spinner>div {
            background-color: burlywood;
    }

Here's how to change the colors for each of the spinners:
(Note I am using version 1.2.5)
In this file I am setting all the colors to Red (#FF0000)

.sk-rotating-plane {
  background-color: #FF0000;
}

.sk-double-bounce > .sk-child {
  background-color: #FF0000;
}

.sk-wave > .sk-rect {
  background-color: #FF0000;
}

.sk-wandering-cubes > .sk-cube {
  background-color: #FF0000;
}

.sk-spinner {
  background-color: #FF0000;
}

.sk-chasing-dots > .sk-child {
  background-color: #FF0000;
}

.sk-three-bounce > .sk-child {
  background-color: #FF0000;
}

.sk-circle .sk-child:before {
  background-color: #FF0000;
}

.sk-cube-grid > .sk-cube {
  background-color: #FF0000;
}

.sk-fading-circle > .sk-circle:before {
  background-color: #FF0000;
}

.sk-folding-cube > .sk-cube:before {
  background-color: #FF0000;
}

It'd be really handy to add this to the README and/or provide a single class that would change any type of spinner. I'm a newb at CSS and this was super helpful for me.

@allancaffee can you PR the README?