UNPKG

5.04 kBMarkdownView Raw
1# Stylus [![Build Status](https://travis-ci.org/stylus/stylus.svg?branch=master)](https://travis-ci.org/stylus/stylus)
2
3 Stylus is a revolutionary new language, providing an efficient, dynamic, and expressive way to generate CSS. Supporting both an indented syntax and regular CSS style.
4
5## Installation
6
7```bash
8$ npm install stylus -g
9```
10
11### Example
12
13```stylus
14border-radius()
15 -webkit-border-radius: arguments
16 -moz-border-radius: arguments
17 border-radius: arguments
18
19body a
20 font: 12px/1.4 "Lucida Grande", Arial, sans-serif
21 background: black
22 color: #ccc
23
24form input
25 padding: 5px
26 border: 1px solid
27 border-radius: 5px
28```
29
30compiles to:
31
32```css
33body a {
34 font: 12px/1.4 "Lucida Grande", Arial, sans-serif;
35 background: #000;
36 color: #ccc;
37}
38form input {
39 padding: 5px;
40 border: 1px solid;
41 -webkit-border-radius: 5px;
42 -moz-border-radius: 5px;
43 border-radius: 5px;
44}
45```
46
47the following is equivalent to the indented version of Stylus source, using the CSS syntax instead:
48
49```stylus
50border-radius() {
51 -webkit-border-radius: arguments
52 -moz-border-radius: arguments
53 border-radius: arguments
54}
55
56body a {
57 font: 12px/1.4 "Lucida Grande", Arial, sans-serif;
58 background: black;
59 color: #ccc;
60}
61
62form input {
63 padding: 5px;
64 border: 1px solid;
65 border-radius: 5px;
66}
67```
68
69### Features
70
71 Stylus has _many_ features. Detailed documentation links follow:
72
73 - [css syntax](docs/css-style.md) support
74 - [mixins](docs/mixins.md)
75 - [keyword arguments](docs/kwargs.md)
76 - [variables](docs/variables.md)
77 - [interpolation](docs/interpolation.md)
78 - arithmetic, logical, and equality [operators](docs/operators.md)
79 - [importing](docs/import.md) of other stylus sheets
80 - [introspection api](docs/introspection.md)
81 - type coercion
82 - [@extend](docs/extend.md)
83 - [conditionals](docs/conditionals.md)
84 - [iteration](docs/iteration.md)
85 - nested [selectors](docs/selectors.md)
86 - parent reference
87 - in-language [functions](docs/functions.md)
88 - [variable arguments](docs/vargs.md)
89 - built-in [functions](docs/bifs.md) (over 60)
90 - optional [image inlining](docs/functions.url.md)
91 - optional compression
92 - JavaScript [API](docs/js.md)
93 - extremely terse syntax
94 - stylus [executable](docs/executable.md)
95 - [error reporting](docs/error-reporting.md)
96 - single-line and multi-line [comments](docs/comments.md)
97 - css [literal](docs/literal.md)
98 - character [escaping](docs/escape.md)
99 - [@keyframes](docs/keyframes.md) support & expansion
100 - [@font-face](docs/font-face.md) support
101 - [@media](docs/media.md) support
102 - Connect [Middleware](docs/middleware.md)
103 - TextMate [bundle](docs/textmate.md)
104 - Coda/SubEtha Edit [Syntax mode](https://github.com/atljeremy/Stylus.mode)
105 - gedit [language-spec](docs/gedit.md)
106 - VIM [Syntax](https://github.com/wavded/vim-stylus)
107 - Espresso [Sugar](https://github.com/aljs/Stylus.sugar)
108 - [Firebug extension](docs/firebug.md)
109 - heroku [web service](http://styl.heroku.com) for compiling stylus
110 - [style guide](https://github.com/lepture/ganam) parser and generator
111 - transparent vendor-specific function expansion
112
113### Community modules
114
115 - https://github.com/stylus/stylus/wiki
116
117### Framework Support
118
119 - [Connect](docs/middleware.md)
120 - [Play! 2.0](https://github.com/patiencelabs/play-stylus)
121 - [Ruby On Rails](https://github.com/forgecrafted/ruby-stylus-source)
122 - [Meteor](http://docs.meteor.com/#stylus)
123 - [Grails](http://grails.org/plugin/stylus-asset-pipeline)
124 - [Derby](https://github.com/derbyjs/derby-stylus)
125
126### CMS Support
127
128 - [DocPad](https://github.com/bevry/docpad)
129 - [Punch](https://github.com/laktek/punch-stylus-compiler)
130
131### Screencasts
132
133 - [Stylus Intro](http://screenr.com/bNY)
134 - [CSS Syntax & Postfix Conditionals](http://screenr.com/A8v)
135
136### Authors
137
138 - [TJ Holowaychuk (tj)](https://github.com/tj)
139
140### More Information
141
142 - Language [comparisons](docs/compare.md)
143
144## License
145
146(The MIT License)
147
148Copyright (c) Automattic <developer.wordpress.com>
149
150Permission is hereby granted, free of charge, to any person obtaining
151a copy of this software and associated documentation files (the
152'Software'), to deal in the Software without restriction, including
153without limitation the rights to use, copy, modify, merge, publish,
154distribute, sublicense, and/or sell copies of the Software, and to
155permit persons to whom the Software is furnished to do so, subject to
156the following conditions:
157
158The above copyright notice and this permission notice shall be
159included in all copies or substantial portions of the Software.
160
161THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND,
162EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
163MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
164IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY
165CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
166TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
167SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.