seed-grid-lite

0.0.2 • Public • Published

seed-grid-lite Build Status npm version dependencies Status

Grid system object pack for Seed! The lite version!

File size

Minified Gzipped
3.36 KB 714 B

Install

npm install seed-grid-lite --save

Basic Usage

SCSS

This seed pack needs to be imported into your sass pipeline. Below is an example using Gulp:

var gulp = require('gulp');
var sass = require('gulp-sass');
var pack = require('seed-grid-lite');
 
gulp.task('sass', function () {
  return gulp.src('./sass/**/*.scss')
    .pipe(sass({
      includePaths: pack
    }))
    .pipe(gulp.dest('./css'));
});

Once that is setup, simply @import seed-grid-lite as needed in your .scss file:

// Packs 
@import "pack/seed-grid-lite/_index";

Options

The following variables can be found in _config.scss

// Namespace 
$seed-grid-lite-container-namespace: o-container !default;
$seed-grid-lite-col-namespace: o-col !default;
$seed-grid-lite-col-block-namespace: o-col-block !default;
$seed-grid-lite-order-namespace: o-col-or !default;
$seed-grid-lite-row-namespace: o-row !default;
 
// Container 
$seed-grid-lite-container-widths: (
  sm: 576px,
  md: 720px,
  lg: 940px,
  xl: 1140px
!default;
 
// Columns 
$seed-grid-lite-columns: (
  20percentage(1/5),
  25percentage(1/4),
  33percentage(1/3),
  50percentage(1/2),
  66percentage(4/6),
  75percentage(3/4),
  80percentage(4/5),
  100: 100%,
!default;
 
// Gutter 
$seed-grid-lite-gutter: (
  default: 15px,
  sm: 10px,
  xs: 5px,
  0: 0px,
!default;
 
// Order 
$seed-grid-lite-order: (
  1: 1,
  2: 2,
!default;

Package Sidebar

Install

npm i seed-grid-lite

Weekly Downloads

1

Version

0.0.2

License

MIT

Last publish

Collaborators

  • itsjonq