How to dynamically change css values (like color in whole app) etc

Question

I have one question...

If you want conditional styling: you must use ng-class or ng-style construction.

But...

For example: I\'

Answer 1

The best way is generate a file like color.css with all css rules with color, background-color, border-color etc. overridden. But angularjs will not be enough.

color-default.css

body {
    background: #fff;
}

color.css

body {
    background: #f00;
}

---

Full JS way
Add class on every element you want to override. Create class for every properties like so:

.skin-color { color: {{color}}; }
.skin-background-color { background-color: {{color}}; }
.skin-border-color { border-color: {{color}}; }
etc..

Apply class on your html where you want:

My title
Hello I'm online!
No difference!
I'm link

You can save the color variable in localStorage for example.
Démo: http://codepen.io/anon/pen/jPrabY