docpad-plugin-stylus

Adds support for the Stylus CSS pre-processor to DocPad

npm install docpad-plugin-stylus
108 downloads in the last day
384 downloads in the last week
1 091 downloads in the last month

Stylus Plugin for DocPad

Build Status NPM version Dependency Status Development Dependency Status
Gittip donate button Flattr donate button PayPayl donate button BitCoin donate button Wishlist browse button

Adds support for the Stylus CSS pre-processor to DocPad

Convention: .css.styl|stylus

Install

docpad install stylus

Configure

Defaults

The default configuration for this plugin is the equivalant of adding the following to your DocPad configuration file.

plugins:
    stylus:
        stylusLibraries:
            nib: true
        stylusOptions:
            compress: true
            'include css': true

# Disable compression on the development environment
environments:
    development:
        stylusOptions:
            compress: false

Stylus Options

You can customise the options sent to stylus using the stylusOptions object. See the available options here.

Stylus Libraries

By default we include the Nib Stylus Library.

Using Nib

Nib is a small and powerful library for the Stylus CSS language, providing robust cross-browser CSS3 mixins to make your life as a designer easier. By default nib support is enabled, but it can be disabled by setting the useNib option to false.

To use Nib, add the following to your main stylus file:

@import 'nib'

Alternatively, if you would prefer to use individual parts like gradient support, you can do this by using:

@import 'nib/gradients'

Turning off Nib

You can also turn off the inclusion of the Nib by setting the following:

plugins:
    stylus:
        stylusLibraries:
            nib: false

Using a custom Library (like Axis)

You can include your own custom libraries, providing you npm install them yourself.

To use the Axis Stylus Library instead of Nib, you first first install axis by doing:

npm install --save axis-css

Then update our DocPad configuration file with:

plugins:
    stylus:
        stylusLibraries:
            nib: false
            'axis-css': true

You can also customise the configuration sent to the library by doing the following, in this case, we set the axis implicit property to false:

plugins:
    stylus:
        stylusLibraries:
            nib: false
            'axis-css':
                implicit: false

History

Discover the change history by heading on over to the HISTORY.md file.

Contribute

Discover how you can contribute by heading on over to the CONTRIBUTING.md file.

Backers

Maintainers

These amazing people are maintaining this project:

Sponsors

No sponsors yet! Will you be the first?

Gittip donate button Flattr donate button PayPayl donate button BitCoin donate button Wishlist browse button

Contributors

These amazing people have contributed code to this project:

Become a contributor!

License

Licensed under the incredibly permissive MIT license

Copyright © 2012+ Bevry Pty Ltd us@bevry.me (http://bevry.me)

npm loves you