Question

I am developing a website and i want to allow the user to switch themes (mainly colors,fonts etc, not layout).

My idea is to have a class on the body, say theme1, and then put all styling under that class:

.theme1{
    //less code here
}


.theme2{
    //less code here
}

That way, in order to switch theme, all I have to do is replace the class on the body.

Is that a good solution, is there a better way?

Answer 1

If you’re using LESS then it’s pretty straightforward to wrap all your styling in a

body.theme-class { }

selector.

This seems reasonable; it makes changing the theme a simple case of changing the class on the body tag.