bitcrowd / bitstyles

A complete design system, with base styles and components, built in Sass using CSS variables
https://bitcrowd.github.io/bitstyles
ISC License
16 stars 0 forks source link

Switch the order of distance & direction used in utility classnames? #655

Open planktonic opened 2 years ago

planktonic commented 2 years ago

Our directional utility classnames have have the order:

<layer-abbreviation>-<css property>-<size/value>-<direction>

e.g.

.u-margin-m-left

This feels a little unintuitive, maybe as it doesn’t match the way CSS itself is written e.g., margin-left: 1rem, and it leads to our inset/positioning classes being e.g. u-0-top, u-0-right etc. u-top-0 seems more easily readable.

Should we change the order, for one of the upcoming major-version releases?