How to deal with CSS preprocessors like Sass and LESS?

Compiling .scss or .less files to .css mangles our inline /* .. */ comments. The suggested way to deal with this is;

Using the 7.x-2.x version that solves the issue. There are some differences in usage. Follow the instructions of the included README.txt file.

Alternatively: For the 7.x-1.x dev version by having a CSS file /css/style_settings.css in the theme's css folder that:

1. only contains the CSS that one optionally wants to be configurable from the UI
2. is not compiled (no .scss or .less version exists)
3. uses the same CSS selectors as that in the .scss or .less files for the CSS it is supposed to override. Read why. Check the compiled CSS files to find them as those in the .scss or .less files are likely hard to find due to the nesting of selectors.

Presuming you declare style_settings as a soft-dependency in the .info file of your theme, the /css/style_settings.css will be ignored (not loaded) if the Style Settings module is not enabled. If it is enabled, the module will take care of loading the style_settings.css file it finds in the active theme (also admin theme). It is loaded as one of the last stylesheets so it overrides CSS rules in the compiled CSS files.

Also the 7.x-2.x version handles an optional /css/style_settings.css in the theme's css folder in the same way. Possible reasons to do so:

1. If changing the original theme css, scss or less files with trailing comments is not wanted.
2. If CSS exists that only makes sense having if configurable.
3. If other default values are desired for configurable CSS.

1. #2543652: We can add Style (CSS) Settings to your module or theme. Just ask us to write a patch for your project..
2. How to add configurable CSS to your module, theme or site?
3. How to deal with CSS preprocessors like Sass and LESS?
4. How to provide form elements on your settings page?
5. Code example