Pass the CSS files through a cleaner/indenter

[rbrito]

The files have all inconsistent indentation and we should use some tool such as tidycss (or any other) to make sure that we keep everything uniform.

[robertpainsi]

Hi @rbrito! :smile:

I tried two css formatter but overall they don't do a good job.

csstidy (http://www.codebeautifier.com/): Somehow removes all intendions.

cssbeautify (http://cssbeautify.com/): Cleans up the css very well, however some properties have special intentions like:

    box-shadow: inset  0px  1px alpha(#fff, 0.09),
                inset  2px  0px alpha(#fff, 0.07),
                inset  1px  0px shade(@button_border, 1.10),
                inset -2px  0px alpha(#fff, 0.07),
                inset -1px  0px shade(@button_border, 1.10),
                inset  0px -1px alpha(#fff, 0.05);

Here, cssbeautify won't change tabs to spaces. Also it ignores them in and before block comments.

My plan would be running cssbeautify over all css files and then convert tabs to 4 spaces by terminal. However, if someone finds a better css formatter or solution I would be glad!

[rbrito]

What operating system are you using?

If you are using Debian (or any derivatives), the tool that these sites all seem to use is in the package csstidy and, if you give it conservative enough options on the command-line, then it will keep some indentation.

(Of course, it doesn't know about intentional, "semantic" indents).

It also doesn't seem to know about newer CSS constructs, but I guess that telling it to just pass-through what it doesn't understand may be a viable choice (I have not yet tried this). Alternatively, there's a new fork of csstidy (this one I have not tried) which promises to understand more of CSS.

If they strip comments, I guess that we can add them back (of course, this is only feasible once we unified files and do the job only once).