Automatically Generate CSS Sprites from Images with Stylus
Stylus-Lemonade is a plugin for Node.js Stylus
which allows you to use functions like
*.styl markup to automatically fetch images and generate css sprites at render time.
If you come from the Ruby on Rails community, you will immediately recognize conventions from Spriting with Compass/SASS, originally Lemonade.
sudo apt-get install libgd2-xpm-dev # on ubuntu; a libgd dependencynpm install stylus-lemonade
For the very latest and most comprehensive example, see test/integration/server.js.
var stylus = ;;
For the very latest and most comprehensive examples, see test/fixtures/private/stylesheets/application.styl.
Will output CSS like this:
And the image will turn out like this:
npm test # build coffee, run mocha unit test, run chrome browser integration test