properties order are not respected

[Gastonite]

First of all, thank you for this very useful library =)

I'm looking to apply CSS rules in a certain order, but it seems that the properties are alphabetically ordered, resulting in CSS whose properties don't follow the expected order.

For example, if I set the 'borderColor' property first, and then the 'borderBottomColor' property, I was expecting the most specific property to be set last, so as to override the most generic one.

Since the properties are ordered alphabetically, this does not produce the expected result:

var insertCss = require("insert-css");
var FreeStyle = require("free-style");

var Style = FreeStyle.create();

var buttonStyle = Style.registerStyle({
  $displayName: "button",
  borderStyle: "solid",
  borderColor: "transparent",
  borderBottomColor: "black",
  borderTopColor: "black"
});

function app(targetEl) {
  var btnEl = document.createElement("button");
  btnEl.textContent = "Click me!";
  btnEl.className = buttonStyle;
  targetEl.appendChild(btnEl);
}

insertCss(Style.getStyles());

app(document.body);

I have created a Codesandbox example, where I was expecting the bottom border to be black, but it is not

[blakeembrey]

Thanks for the report, it's a good call, I didn't think about this possibility when I first wrote it. I'd be happy to accept a PR that removes sorting of properties. It'd slightly affect CSS output size, but I think that's a reasonable trade-off when most of the time the property order is probably hard-coded anyway.

[blakeembrey]

Changed in the latest major release.