Use same properties-order logic as stylelint-order

According to the properties-order definition for stylelint-order:

If an (unprefixed) property name is not included in your array and it contains a hyphen (e.g. padding-left), this rule will look for the string before that first hyphen in your array (e.g. padding) and use that position.

This creates an inconsistency with how postcss-sorting handles properties-order.

If I have the following rule:

'properties-order': [
  'border',
  'color',
],
'unspecified-properties-position': 'bottom',

And the following css:

.container {
  border: 6px solid black;
  border-right-width: 18px;
  color: red;
}

The css linting by stylelint-order will not give any warnings.

However, if I were to then run postcss-sorting, the border-right-width is moved to the bottom resulting in the following css:

.container {
  border: 6px solid black;
  color: red;
  border-right-width: 18px;
}

Now the css linting by stylelint-order will give the error:

[stylelint] Expected "border-right-width" to come before "color" (order/properties-order)

[TrevorSayre]

Alright, I understand the direction you’re taking. Thank you for taking the time to explain your thoughts.

[hudochenkov]

If you list out all the border-* properties, than this config will work exactly the same in stylelint-order and postcss-sorting right now and in future versions.

This seems like more effort.

It is, but it’s one time effort, and you don’t have to write down every property from the head. You can use this as a reference.