Skip to content

244 Property Sort Order changes, rule comments

Compare
Choose a tag to compare
@TheJaredWilcurt TheJaredWilcurt released this 09 Jun 22:11

Details

I've commented every rule to it easier to understand what is does.

I looked at the SMACSS property order, which, honestly is kind of bad (error prone ordering, duplicates, shorthand after longform, grouping of unrelated things, etc), but it did have 52 properties I was missing, so I've merged those into my ruleset in a much cleaner manner.

Then that brought me to Concentric and another file claiming to be concentric 🤷‍♂️. And also the long deprecated Recess. Comparing against my rule set there was another 22 properties I didn't have. And of those 22 only 8 were ones I'd want. Many weren't real properties or were old deprecated ones that only existed in old Opera. They're old and deprecated and I'd rather you get a warning/error if you use those so you can stop using them.

...and it was at that point I said "fuck it" and just went to MDN where, of course, their list of CSS properties is combined with units and a bunch of other crap. So then I just did a quick googlin' to see that all "complete css property lists" are garbage, most don't even have Grid. So I just manually culled the MDN list, which was painful and annoying and I ended up learning all sorts of things. I bet you didn't know about hanging-punctuation or box-decoration-break or that grid-gap is going to be renamed to gap probably. That was very time consuming and I regret everything I've ever done. So yeah, that's another 150ish new properties. Plus some random one-offs I did while doing research.

Also reorganized longform animation/transition properties to better follow the shorthand order (previously were just abecedarian).

Since I'm pointing out that SMACSS has duplicate properties and don't want to look stupid in the future, I added in an automated test to make sure there are no dupes in my property-sort-order rule.

With this many new properties (and moving some existing around), it could break people's builds as the linter could fail and require them to re-order some properties. Doing a major bump from v1 to v2 for this.


Summary

  • All rules are commented
  • 238 new CSS properties added
  • transition and animation re-ordered
  • Added a test to ensure there are no duplicates in the property-sort-order rule

Changes

All changes since last release:

All changes since v1.1.0

All changes since v1.0.0