ciser
Version:
Functional CSS, help quickly build and design new UI without writing css.
561 lines (523 loc) • 20.6 kB
Markdown
# 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:
```
<link rel="stylesheet" href="http://unpkg.com/tachyons-cli@1.0.11/css/tachyons-cli.min.css" />
```
##### 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
<link rel="stylesheet" href="path/to/module/css/tachyons-cli">
```
#### 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