CSS Alphabetize plugin for VSCode

Ever get tired of seeing CSS like this?

tagName {    width: 500px;    color: #f0a10c;    margin-left: 1rem;    text-align: left;    display: flex;    transform: translate(-50%);    background-color: green;}

It's impossible to tell what is where. It should look like this:

tagName {    background-color: green;    color: #f0a10c;    display: flex;    margin-left: 1rem;    text-align: left;    transform: translate(-50%);    width: 500px;}

Now you can easily tell which properties exist in the block and where you should be making your changes.

This past Saturday, I whipped together a quick plugin for VSCode that will organize your CSS/SASS properties. You can install it here: https://marketplace.visualstudio.com/items?itemName=PolymerMallard.css-alphabetize

The dropdown command shift+cmd+p is named: "CSS/SASS: Alphabetize Properties"

The default keyboard shortcut is: shift+alt+a