Use single underscore for BEM modifier classes instead of double-hyphen

As of the 2.3.1 release of @salesforce-ux/design-system, it seems that the double-hyphen -- syntax for CSS modifier classes has been deprecated in favor of a single underscore _.

From https://www.lightningdesignsystem.com/release-notes/:

Release 2.3.1 - May 25, 2017

Big Impact

BEM Naming Change Initially we used the double dash style for BEM notation (–). Due to the fact that double dashes are problematic in an XML environment (which doesn’t allow double dashes within comments), we have upgraded our syntax to use the single underscore style (_). This change is backward compatible for 18 months. But all components going forward are built with the single underscore BEM style.

Ironically, the markup on that page seems to still use the double-hyphen syntax.

If the single underscore is the recommended syntax going forward (and if the double-hyphen syntax will be removed in a few months), it would be great to switch the @salesforce/design-system-react components and the examples in the documentation to use the new syntax.

In our codebase, it has caused a mixed use of both syntaxes. I ended up writing an ESLint rule with a fixer to resolve the issue for us (which I’m happy to provide here as well if you think it will be useful).

[interactivellama]

You can build on this if you want. https://github.com/salesforce/design-system-react/pull/1528

[interactivellama]

I plan to remove prettier-eslint in the next month or so and just go straight prettier AND eslint. I can remove it sooner than later if it makes it easier for you.