I would like to change the page style based on user preferences.
The page will load with a given style, but if the user clicks a button, the page layout should change. If he clicks again, the style should change back to the original style. The changes are large (about 70 CSS lines), but only change a specific part of the page.
I can write a JavaScript function that modifies the CSS styles for all the relevant tags, but that would be tedious and will introduce too much CSS into my code. I would rather keep it in the CSS file if I can.
I can also add styling A to the CSS file, with reference to class A in all the relevant tags and add style B to the CSS file, with reference to class B in all the relevant tags. Then the JavaScript code would just have to change the class on the relevant tags.
What is the best way to approach this?