Reformat SASS files with prettier

[blowery]

The results of running prettier over all of the scss files in the repo.

Changes proposed in this Pull Request

• Reformat scss files with prettier

Testing instructions

• Everything should look the way it did before
• CSS output shouldn't really change

[matticbot]

Test live: https://calypso.live/?branch=update/sass-formatting

[blowery]

I'm pretty sure this is using interpolation to insert an actual comment for later processing by rtlcss. I don't think moving from " to ' has any effect.

[blowery]

Added #29604 as an optional add-on to this PR, which updates our stylelint rules a touch and runs --fix on everything.

[blowery]

Hrm, turns out prettier's SASS support has a few nasty bugs:
https://github.com/prettier/prettier/issues?utf8=%E2%9C%93&q=is%3Aissue+is%3Aopen+scss

Especially:
prettier/prettier#5603 - busted single line comments
prettier/prettier#4878 - same
prettier/prettier#4659 - same

The single line comment bug broke our z-index functions when i tried to apply prettier to it. :/
The first rule of a formatter has to be "do no harm" and prettier is failing that.

Maybe we don't want to use prettier for SASS just yet...?

cc @sirreal @Automattic/team-calypso

[blowery]

To repro the bugs in our codebase, run prettier against assets/stylesheets/shared/functions/_z-index.scss. Then try to run npm run build-css and you'll see it fail. The problem is the single line comments in the map getting pulled together and a map index ends up at the end of comment, breaking the syntax of the map.

[blowery]

Closing in favor of #29697

[belcherj]

Prettier tanks on: assets/stylesheets/shared/functions/_z-index.scss

[jsnajdr]

I spent some time hacking Prettier over the holidays, and came up with two fixes for SCSS formatting:

• Fix parsing double slash comments inside Sass maps shellscape/postcss-values-parser#60
• Fix formatting of lists in SCSS property/variable values prettier/prettier#5710

Some other bugs still remain, including some that break code rather than just formatting it incorrectly. The most severe is prettier/prettier#5603. There I posted an analysis of the causes, but a fix won't be easy.