# tachyons-cli 1.0.11 Postprocess tachyons stylesheets #### Stats 1454 | 429 | 533 ---|---|--- bytes | selectors | declarations ## Installation #### With [npm](https://npmjs.com) ``` npm install --save-dev tachyons-cli ``` Learn more about using css installed with npm: * https://webpack.github.io/docs/stylesheets.html * https://github.com/defunctzombie/npm-css #### With Git http: ``` git clone https://github.com/tachyons-css/tachyons-cli ``` ssh: ``` git clone git@github.com:tachyons-css/tachyons-cli.git ``` ## Usage #### Using with [Postcss](https://github.com/postcss/postcss) Import the css module ```css @import "tachyons-cli"; ``` Then process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli) ```sh $ npm i -g tachyons-cli $ tachyons path/to/css-file.css > dist/t.css ``` #### Using the css ##### CDN The easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with: ``` ``` ##### Locally The built css is located in the `css` directory. It contains an unminified and minified version. You can either cut and paste that css or link to it directly in your html. ```html ``` #### Development The source css files can be found in the `src` directory. Running `$ npm start` will process the source css and place the built css in the `css` directory. ## The css ```css /* NEGATIVE MARGINS Base: n = negative Modifiers: a = all t = top r = right b = bottom l = left 1 = 1st step in spacing scale 2 = 2nd step in spacing scale 3 = 3rd step in spacing scale 4 = 4th step in spacing scale 5 = 5th step in spacing scale 6 = 6th step in spacing scale 7 = 7th step in spacing scale Media Query Extensions: -ns = not-small -m = medium -ml = mobile landscape -l = large */ .na1 { margin: undefined; } .na1s { margin: undefined; } .na2 { margin: undefined; } .na2s { margin: undefined; } .na3 { margin: undefined; } .na3s { margin: undefined; } .na4 { margin: undefined; } .na4s { margin: undefined; } .na5 { margin: undefined; } .na5s { margin: undefined; } .na6 { margin: undefined; } .na6s { margin: undefined; } .na7 { margin: undefined; } .nl1 { margin-left: undefined; } .nl1s { margin-left: undefined; } .nl2 { margin-left: undefined; } .nl2s { margin-left: undefined; } .nl3 { margin-left: undefined; } .nl3s { margin-left: undefined; } .nl4 { margin-left: undefined; } .nl4s { margin-left: undefined; } .nl5 { margin-left: undefined; } .nl5s { margin-left: undefined; } .nl6 { margin-left: undefined; } .nl6s { margin-left: undefined; } .nl7 { margin-left: undefined; } .nr1 { margin-right: undefined; } .nr1s { margin-right: undefined; } .nr2 { margin-right: undefined; } .nr2s { margin-right: undefined; } .nr3 { margin-right: undefined; } .nr3s { margin-right: undefined; } .nr4 { margin-right: undefined; } .nr4s { margin-right: undefined; } .nr5 { margin-right: undefined; } .nr5s { margin-right: undefined; } .nr6 { margin-right: undefined; } .nr6s { margin-right: undefined; } .nr7 { margin-right: undefined; } .nb1 { margin-bottom: undefined; } .nb1s { margin-bottom: undefined; } .nb2 { margin-bottom: undefined; } .nb2s { margin-bottom: undefined; } .nb3 { margin-bottom: undefined; } .nb3s { margin-bottom: undefined; } .nb4 { margin-bottom: undefined; } .nb4s { margin-bottom: undefined; } .nb5 { margin-bottom: undefined; } .nb5s { margin-bottom: undefined; } .nb6 { margin-bottom: undefined; } .nb6s { margin-bottom: undefined; } .nb7 { margin-bottom: undefined; } .nt1 { margin-top: undefined; } .nt1s { margin-top: undefined; } .nt2 { margin-top: undefined; } .nt2s { margin-top: undefined; } .nt3 { margin-top: undefined; } .nt3s { margin-top: undefined; } .nt4 { margin-top: undefined; } .nt4s { margin-top: undefined; } .nt5 { margin-top: undefined; } .nt5s { margin-top: undefined; } .nt6 { margin-top: undefined; } .nt6s { margin-top: undefined; } .nt7 { margin-top: undefined; } @media screen and (min-width: 30em) { .na1-ns { margin: undefined; } .na1s-ns { margin: undefined; } .na2-ns { margin: undefined; } .na2s-ns { margin: undefined; } .na3-ns { margin: undefined; } .na3s-ns { margin: undefined; } .na4-ns { margin: undefined; } .na4s-ns { margin: undefined; } .na5-ns { margin: undefined; } .na5s-ns { margin: undefined; } .na6-ns { margin: undefined; } .na6s-ns { margin: undefined; } .na7-ns { margin: undefined; } .nl1-ns { margin-left: undefined; } .nl1s-ns { margin-left: undefined; } .nl2-ns { margin-left: undefined; } .nl2s-ns { margin-left: undefined; } .nl3-ns { margin-left: undefined; } .nl3s-ns { margin-left: undefined; } .nl4-ns { margin-left: undefined; } .nl4s-ns { margin-left: undefined; } .nl5-ns { margin-left: undefined; } .nl5s-ns { margin-left: undefined; } .nl6-ns { margin-left: undefined; } .nl6s-ns { margin-left: undefined; } .nl7-ns { margin-left: undefined; } .nr1-ns { margin-right: undefined; } .nr1s-ns { margin-right: undefined; } .nr2-ns { margin-right: undefined; } .nr2s-ns { margin-right: undefined; } .nr3-ns { margin-right: undefined; } .nr3s-ns { margin-right: undefined; } .nr4-ns { margin-right: undefined; } .nr4s-ns { margin-right: undefined; } .nr5-ns { margin-right: undefined; } .nr5s-ns { margin-right: undefined; } .nr6-ns { margin-right: undefined; } .nr6s-ns { margin-right: undefined; } .nr7-ns { margin-right: undefined; } .nb1-ns { margin-bottom: undefined; } .nb1s-ns { margin-bottom: undefined; } .nb2-ns { margin-bottom: undefined; } .nb2s-ns { margin-bottom: undefined; } .nb3-ns { margin-bottom: undefined; } .nb3s-ns { margin-bottom: undefined; } .nb4-ns { margin-bottom: undefined; } .nb4s-ns { margin-bottom: undefined; } .nb5-ns { margin-bottom: undefined; } .nb5s-ns { margin-bottom: undefined; } .nb6-ns { margin-bottom: undefined; } .nb6s-ns { margin-bottom: undefined; } .nb7-ns { margin-bottom: undefined; } .nt1-ns { margin-top: undefined; } .nt1s-ns { margin-top: undefined; } .nt2-ns { margin-top: undefined; } .nt2s-ns { margin-top: undefined; } .nt3-ns { margin-top: undefined; } .nt3s-ns { margin-top: undefined; } .nt4-ns { margin-top: undefined; } .nt4s-ns { margin-top: undefined; } .nt5-ns { margin-top: undefined; } .nt5s-ns { margin-top: undefined; } .nt6-ns { margin-top: undefined; } .nt6s-ns { margin-top: undefined; } .nt7-ns { margin-top: undefined; } .nv1-ns { margin-top: undefined; margin-bottom: undefined; } .nv1s-ns { margin-top: undefined; margin-bottom: undefined; } .nv2-ns { margin-top: undefined; margin-bottom: undefined; } .nv2s-ns { margin-top: undefined; margin-bottom: undefined; } .nv3-ns { margin-top: undefined; margin-bottom: undefined; } .nv3s-ns { margin-top: undefined; margin-bottom: undefined; } .nv4-ns { margin-top: undefined; margin-bottom: undefined; } .nv4s-ns { margin-top: undefined; margin-bottom: undefined; } .nv5-ns { margin-top: undefined; margin-bottom: undefined; } .nv5s-ns { margin-top: undefined; margin-bottom: undefined; } .nv6-ns { margin-top: undefined; margin-bottom: undefined; } .nv6s-ns { margin-top: undefined; margin-bottom: undefined; } .nv7-ns { margin-top: undefined; margin-bottom: undefined; } .nh1-ns { margin-left: undefined; margin-right: undefined; } .nh1s-ns { margin-left: undefined; margin-right: undefined; } .nh2-ns { margin-left: undefined; margin-right: undefined; } .nh2s-ns { margin-left: undefined; margin-right: undefined; } .nh3-ns { margin-left: undefined; margin-right: undefined; } .nh3s-ns { margin-left: undefined; margin-right: undefined; } .nh4-ns { margin-left: undefined; margin-right: undefined; } .nh4s-ns { margin-left: undefined; margin-right: undefined; } .nh5-ns { margin-left: undefined; margin-right: undefined; } .nh5s-ns { margin-left: undefined; margin-right: undefined; } .nh6-ns { margin-left: undefined; margin-right: undefined; } .nh6s-ns { margin-left: undefined; margin-right: undefined; } .nh7-ns { margin-left: undefined; margin-right: undefined; } } @media screen and (min-width: 30em) and (max-width: 60em) { .na1-m { margin: undefined; } .na1s-m { margin: undefined; } .na2-m { margin: undefined; } .na2s-m { margin: undefined; } .na3-m { margin: undefined; } .na3s-m { margin: undefined; } .na4-m { margin: undefined; } .na4s-m { margin: undefined; } .na5-m { margin: undefined; } .na5s-m { margin: undefined; } .na6-m { margin: undefined; } .na6s-m { margin: undefined; } .na7-m { margin: undefined; } .nl1-m { margin-left: undefined; } .nl1s-m { margin-left: undefined; } .nl2-m { margin-left: undefined; } .nl2s-m { margin-left: undefined; } .nl3-m { margin-left: undefined; } .nl3s-m { margin-left: undefined; } .nl4-m { margin-left: undefined; } .nl4s-m { margin-left: undefined; } .nl5-m { margin-left: undefined; } .nl5s-m { margin-left: undefined; } .nl6-m { margin-left: undefined; } .nl6s-m { margin-left: undefined; } .nl7-m { margin-left: undefined; } .nr1-m { margin-right: undefined; } .nr1s-m { margin-right: undefined; } .nr2-m { margin-right: undefined; } .nr2s-m { margin-right: undefined; } .nr3-m { margin-right: undefined; } .nr3s-m { margin-right: undefined; } .nr4-m { margin-right: undefined; } .nr4s-m { margin-right: undefined; } .nr5-m { margin-right: undefined; } .nr5s-m { margin-right: undefined; } .nr6-m { margin-right: undefined; } .nr6s-m { margin-right: undefined; } .nr7-m { margin-right: undefined; } .nb1-m { margin-bottom: undefined; } .nb1s-m { margin-bottom: undefined; } .nb2-m { margin-bottom: undefined; } .nb2s-m { margin-bottom: undefined; } .nb3-m { margin-bottom: undefined; } .nb3s-m { margin-bottom: undefined; } .nb4-m { margin-bottom: undefined; } .nb4s-m { margin-bottom: undefined; } .nb5-m { margin-bottom: undefined; } .nb5s-m { margin-bottom: undefined; } .nb6-m { margin-bottom: undefined; } .nb6s-m { margin-bottom: undefined; } .nb7-m { margin-bottom: undefined; } .nt1-m { margin-top: undefined; } .nt1s-m { margin-top: undefined; } .nt2-m { margin-top: undefined; } .nt2s-m { margin-top: undefined; } .nt3-m { margin-top: undefined; } .nt3s-m { margin-top: undefined; } .nt4-m { margin-top: undefined; } .nt4s-m { margin-top: undefined; } .nt5-m { margin-top: undefined; } .nt5s-m { margin-top: undefined; } .nt6-m { margin-top: undefined; } .nt6s-m { margin-top: undefined; } .nt7-m { margin-top: undefined; } .nv1-m { margin-top: undefined; margin-bottom: undefined; } .nv1s-m { margin-top: undefined; margin-bottom: undefined; } .nv2-m { margin-top: undefined; margin-bottom: undefined; } .nv2s-m { margin-top: undefined; margin-bottom: undefined; } .nv3-m { margin-top: undefined; margin-bottom: undefined; } .nv3s-m { margin-top: undefined; margin-bottom: undefined; } .nv4-m { margin-top: undefined; margin-bottom: undefined; } .nv4s-m { margin-top: undefined; margin-bottom: undefined; } .nv5-m { margin-top: undefined; margin-bottom: undefined; } .nv5s-m { margin-top: undefined; margin-bottom: undefined; } .nv6-m { margin-top: undefined; margin-bottom: undefined; } .nv6s-m { margin-top: undefined; margin-bottom: undefined; } .nv7-m { margin-top: undefined; margin-bottom: undefined; } .nh1-m { margin-left: undefined; margin-right: undefined; } .nh1s-m { margin-left: undefined; margin-right: undefined; } .nh2-m { margin-left: undefined; margin-right: undefined; } .nh2s-m { margin-left: undefined; margin-right: undefined; } .nh3-m { margin-left: undefined; margin-right: undefined; } .nh3s-m { margin-left: undefined; margin-right: undefined; } .nh4-m { margin-left: undefined; margin-right: undefined; } .nh4s-m { margin-left: undefined; margin-right: undefined; } .nh5-m { margin-left: undefined; margin-right: undefined; } .nh5s-m { margin-left: undefined; margin-right: undefined; } .nh6-m { margin-left: undefined; margin-right: undefined; } .nh6s-m { margin-left: undefined; margin-right: undefined; } .nh7-m { margin-left: undefined; margin-right: undefined; } } @media screen and (max-width: 60em) and (orientation: landscape) { .na1-ml { margin: undefined; } .na1s-ml { margin: undefined; } .na2-ml { margin: undefined; } .na2s-ml { margin: undefined; } .na3-ml { margin: undefined; } .na3s-ml { margin: undefined; } .na4-ml { margin: undefined; } .na4s-ml { margin: undefined; } .na5-ml { margin: undefined; } .na5s-ml { margin: undefined; } .na6-ml { margin: undefined; } .na6s-ml { margin: undefined; } .na7-ml { margin: undefined; } .nl1-ml { margin-left: undefined; } .nl1s-ml { margin-left: undefined; } .nl2-ml { margin-left: undefined; } .nl2s-ml { margin-left: undefined; } .nl3-ml { margin-left: undefined; } .nl3s-ml { margin-left: undefined; } .nl4-ml { margin-left: undefined; } .nl4s-ml { margin-left: undefined; } .nl5-ml { margin-left: undefined; } .nl5s-ml { margin-left: undefined; } .nl6-ml { margin-left: undefined; } .nl6s-ml { margin-left: undefined; } .nl7-ml { margin-left: undefined; } .nr1-ml { margin-right: undefined; } .nr1s-ml { margin-right: undefined; } .nr2-ml { margin-right: undefined; } .nr2s-ml { margin-right: undefined; } .nr3-ml { margin-right: undefined; } .nr3s-ml { margin-right: undefined; } .nr4-ml { margin-right: undefined; } .nr4s-ml { margin-right: undefined; } .nr5-ml { margin-right: undefined; } .nr5s-ml { margin-right: undefined; } .nr6-ml { margin-right: undefined; } .nr6s-ml { margin-right: undefined; } .nr7-ml { margin-right: undefined; } .nb1-ml { margin-bottom: undefined; } .nb1s-ml { margin-bottom: undefined; } .nb2-ml { margin-bottom: undefined; } .nb2s-ml { margin-bottom: undefined; } .nb3-ml { margin-bottom: undefined; } .nb3s-ml { margin-bottom: undefined; } .nb4-ml { margin-bottom: undefined; } .nb4s-ml { margin-bottom: undefined; } .nb5-ml { margin-bottom: undefined; } .nb5s-ml { margin-bottom: undefined; } .nb6-ml { margin-bottom: undefined; } .nb6s-ml { margin-bottom: undefined; } .nb7-ml { margin-bottom: undefined; } .nt1-ml { margin-top: undefined; } .nt1s-ml { margin-top: undefined; } .nt2-ml { margin-top: undefined; } .nt2s-ml { margin-top: undefined; } .nt3-ml { margin-top: undefined; } .nt3s-ml { margin-top: undefined; } .nt4-ml { margin-top: undefined; } .nt4s-ml { margin-top: undefined; } .nt5-ml { margin-top: undefined; } .nt5s-ml { margin-top: undefined; } .nt6-ml { margin-top: undefined; } .nt6s-ml { margin-top: undefined; } .nt7-ml { margin-top: undefined; } .nv1-ml { margin-top: undefined; margin-bottom: undefined; } .nv1s-ml { margin-top: undefined; margin-bottom: undefined; } .nv2-ml { margin-top: undefined; margin-bottom: undefined; } .nv2s-ml { margin-top: undefined; margin-bottom: undefined; } .nv3-ml { margin-top: undefined; margin-bottom: undefined; } .nv3s-ml { margin-top: undefined; margin-bottom: undefined; } .nv4-ml { margin-top: undefined; margin-bottom: undefined; } .nv4s-ml { margin-top: undefined; margin-bottom: undefined; } .nv5-ml { margin-top: undefined; margin-bottom: undefined; } .nv5s-ml { margin-top: undefined; margin-bottom: undefined; } .nv6-ml { margin-top: undefined; margin-bottom: undefined; } .nv6s-ml { margin-top: undefined; margin-bottom: undefined; } .nv7-ml { margin-top: undefined; margin-bottom: undefined; } .nh1-ml { margin-left: undefined; margin-right: undefined; } .nh1s-ml { margin-left: undefined; margin-right: undefined; } .nh2-ml { margin-left: undefined; margin-right: undefined; } .nh2s-ml { margin-left: undefined; margin-right: undefined; } .nh3-ml { margin-left: undefined; margin-right: undefined; } .nh3s-ml { margin-left: undefined; margin-right: undefined; } .nh4-ml { margin-left: undefined; margin-right: undefined; } .nh4s-ml { margin-left: undefined; margin-right: undefined; } .nh5-ml { margin-left: undefined; margin-right: undefined; } .nh5s-ml { margin-left: undefined; margin-right: undefined; } .nh6-ml { margin-left: undefined; margin-right: undefined; } .nh6s-ml { margin-left: undefined; margin-right: undefined; } .nh7-ml { margin-left: undefined; margin-right: undefined; } } @media screen and (min-width: 60em) { .na1-l { margin: undefined; } .na1s-l { margin: undefined; } .na2-l { margin: undefined; } .na2s-l { margin: undefined; } .na3-l { margin: undefined; } .na3s-l { margin: undefined; } .na4-l { margin: undefined; } .na4s-l { margin: undefined; } .na5-l { margin: undefined; } .na5s-l { margin: undefined; } .na6-l { margin: undefined; } .na6s-l { margin: undefined; } .na7-l { margin: undefined; } .nl1-l { margin-left: undefined; } .nl1s-l { margin-left: undefined; } .nl2-l { margin-left: undefined; } .nl2s-l { margin-left: undefined; } .nl3-l { margin-left: undefined; } .nl3s-l { margin-left: undefined; } .nl4-l { margin-left: undefined; } .nl4s-l { margin-left: undefined; } .nl5-l { margin-left: undefined; } .nl5s-l { margin-left: undefined; } .nl6-l { margin-left: undefined; } .nl6s-l { margin-left: undefined; } .nl7-l { margin-left: undefined; } .nr1-l { margin-right: undefined; } .nr1s-l { margin-right: undefined; } .nr2-l { margin-right: undefined; } .nr2s-l { margin-right: undefined; } .nr3-l { margin-right: undefined; } .nr3s-l { margin-right: undefined; } .nr4-l { margin-right: undefined; } .nr4s-l { margin-right: undefined; } .nr5-l { margin-right: undefined; } .nr5s-l { margin-right: undefined; } .nr6-l { margin-right: undefined; } .nr6s-l { margin-right: undefined; } .nr7-l { margin-right: undefined; } .nb1-l { margin-bottom: undefined; } .nb1s-l { margin-bottom: undefined; } .nb2-l { margin-bottom: undefined; } .nb2s-l { margin-bottom: undefined; } .nb3-l { margin-bottom: undefined; } .nb3s-l { margin-bottom: undefined; } .nb4-l { margin-bottom: undefined; } .nb4s-l { margin-bottom: undefined; } .nb5-l { margin-bottom: undefined; } .nb5s-l { margin-bottom: undefined; } .nb6-l { margin-bottom: undefined; } .nb6s-l { margin-bottom: undefined; } .nb7-l { margin-bottom: undefined; } .nt1-l { margin-top: undefined; } .nt1s-l { margin-top: undefined; } .nt2-l { margin-top: undefined; } .nt2s-l { margin-top: undefined; } .nt3-l { margin-top: undefined; } .nt3s-l { margin-top: undefined; } .nt4-l { margin-top: undefined; } .nt4s-l { margin-top: undefined; } .nt5-l { margin-top: undefined; } .nt5s-l { margin-top: undefined; } .nt6-l { margin-top: undefined; } .nt6s-l { margin-top: undefined; } .nt7-l { margin-top: undefined; } .nv1-l { margin-top: undefined; margin-bottom: undefined; } .nv1s-l { margin-top: undefined; margin-bottom: undefined; } .nv2-l { margin-top: undefined; margin-bottom: undefined; } .nv2s-l { margin-top: undefined; margin-bottom: undefined; } .nv3-l { margin-top: undefined; margin-bottom: undefined; } .nv3s-l { margin-top: undefined; margin-bottom: undefined; } .nv4-l { margin-top: undefined; margin-bottom: undefined; } .nv4s-l { margin-top: undefined; margin-bottom: undefined; } .nv5-l { margin-top: undefined; margin-bottom: undefined; } .nv5s-l { margin-top: undefined; margin-bottom: undefined; } .nv6-l { margin-top: undefined; margin-bottom: undefined; } .nv6s-l { margin-top: undefined; margin-bottom: undefined; } .nv7-l { margin-top: undefined; margin-bottom: undefined; } .nh1-l { margin-left: undefined; margin-right: undefined; } .nh1s-l { margin-left: undefined; margin-right: undefined; } .nh2-l { margin-left: undefined; margin-right: undefined; } .nh2s-l { margin-left: undefined; margin-right: undefined; } .nh3-l { margin-left: undefined; margin-right: undefined; } .nh3s-l { margin-left: undefined; margin-right: undefined; } .nh4-l { margin-left: undefined; margin-right: undefined; } .nh4s-l { margin-left: undefined; margin-right: undefined; } .nh5-l { margin-left: undefined; margin-right: undefined; } .nh5s-l { margin-left: undefined; margin-right: undefined; } .nh6-l { margin-left: undefined; margin-right: undefined; } .nh6s-l { margin-left: undefined; margin-right: undefined; } .nh7-l { margin-left: undefined; margin-right: undefined; } } ``` ## Contributing 1. Fork it 2. Create your feature branch (`git checkout -b my-new-feature`) 3. Commit your changes (`git commit -am 'Add some feature'`) 4. Push to the branch (`git push origin my-new-feature`) 5. Create new Pull Request ## Authors * [mrmrs](http://mrmrs.io) * [johno](http://johnotander.com) ## License ISC