Add a CSS Auto-Formatter

[rebeccaskinner]

We should add a CSS auto-formatter to the nix environment, and format the existing CSS so that it looks nice. Consider possibly using a commit hook to auto-format new commits.

[mechamobau]

Does husky it's a good choice to serve as a Git Hook interface (pre-commit) to the project? I'm asking this because I'm interested in contributing to it. If it's not, what kind of solution does it's better to use in the project?

[TikhonJelvis]

Not sure about husky in particular. We're using Nix to manage our dependencies, so having something we can easily add to a Nix shell would be good—what would it take to set something like husky up in Nix?

[mechamobau]

@TikhonJelvis Husky it's anpm package, so it's needed a Node environment to run it. I've suggested that solution because it's that I know that works properly as a Git Hook interface. If it's not the best choice what solution it's better for a Nix environment? What I intend to do is to run stylelint as the CSS linter with husky as the Git hook interface that runs the linter on pre-commit hook, does it makes sense to the project?

[TikhonJelvis]

I'm not sure about the best way to manage git hooks with Nix. A pre-commit hook is more of a nice-to-have convenience than a tool that's absolutely necessary, so adding a direct dependency on NPM for it seems to add too much complexity to be worth doing.

pre-commit-hooks.nix seems like a promising option. However, if you haven't used Nix yourself before, figuring out how to do this would involve a substantial learning curve :/.

stylelint itself is available in Nix as nodePackages.stylelint, so at least that should be easy. One option would be to not worry about precommit hooks and instead do a few things:

1. Make stylelint available in the project's Nix shell
2. Format the existing CSS code
3. Add a check in GitHub actions that fails PRs if the CSS is not formatted correctly

With this setup, people working in the repo can run stylelint manually, configure it in their editors or set up a pre-commit hook on their own if they're so inclined. If somebody doesn't have Nix they'll need to install stylelint themselves or just stick to the formatting guidelines manually as they edit the CSS files.

[mechamobau]

@TikhonJelvis Thanks for the suggestions, I'll work on that ;)

[andys8]

Is this haskeller's way of formatting css? Does #116 have chances to land, in case a tool like stylelint or prettier is integrated via nix?