static-dev / axis

terse, modular & powerful css library
http://axis.netlify.com
Other
320 stars 45 forks source link

WIP: Axis 2.0 #323

Open dbox opened 7 years ago

dbox commented 7 years ago

Hello! We've been working over the last few months rewriting Axis from the ground up, which includes moving away from Stylus. All of the code is now part of the W3c spec, so eventually all browsers will support Axis features out of the box. But, thanks to Postcss & cssnext, we can use all these features, today.

This is a big departure from the current version (which will always be available from the 1.0.0 branch).

On the surface it will seem like a lot of the utilities have been removed, and that is partially true. Many of these have become obsolete from new browser technologies (flexbox, etc) and many now are available as standalone postcss plugins. (I will be posting a full migration guide that covers every feature.)

We're also starting with the minimum framework, so we can get this thing shipped. But we will be adding new tools and mixins quickly. (I will be posting my list as issues as soon as this ships, but please let me know what other features you'd like to see.)

The main difference in 2.0.0 "mixins" (called --apply), is that you cannot pass arguments. So now Axis comes with a very powerful settings file. Here you can quickly edit just about every aspect of your design.

Once we publish this pre-release here's how to install:

npm install axis@2.0.0-alpha.1 --save

Then make sure you are using postcss-import and call Axis at the top of your css:

@import 'axis';

/* Your awesome css here */

The main thing that would be super helpful now is getting some more eyeballs on this and testing it. It's particularly important for us to nail down the variable names as changing those in the future will be breaking changes.

You can view the current kitchen sink here. Full docs will be coming in the next few days, but until then the code is pretty well commented, so get in there and start diving in! Thanks!

@jescalan Feel free to interject anything I'm forgetting here. 💥

jescalan commented 7 years ago

🎉 Exciting stuff! Already using it in 2 sites I'm currently working on, and it's been great so far. Only thing is that we should run 2.0.0-alpha.1, just because of the way semver parses.

mblarsen commented 7 years ago

Is there a minimal doc or a sample project anywhere?

jescalan commented 7 years ago

@mblarsen http://axis2.netlify.com/ 😁