sGrid / Npm Package

Standalone Npm package

sGrid on Npm Basic usage of S-Grid is by simply installing the npm package and including .styl files in your project. You can install it by:

$ npm install -g s-grid


Then in your project (main .styl file) include files:

@import 's-grid-settings'
// you can overwrite settings here
@import 's-grid-functions'
@import 's-grid-classes' // classes are optional - good for prototyping


Of course you can integrate it with your build systems. Also you need to use autoprefixer-stylus. This is importat because of many flexbox vendor prefixes. Read more about it on its website.

You can use it with your command line like:

$ stylus -u s-grid -u autoprefixer-stylus -w main.styl


It can be used as a standard Stylus plugin:

var stylus = require('stylus');
var autoprefixer = require('autoprefixer-stylus');
var sGrid = require('s-grid');

    .render(function(err, output){


Of course a better approach is to use it with the Grunt based scaffold project or with the Meteor project. There is a Meteor package on Atmosphere. Also you can use React boilerplate with sGrid and Webpack.

Here are the package's links:

For more detailed grid documentation see here: Grid