@seedcss/seed-breakpoints

1.0.1 • Public • Published

seed-breakpoints

npm version

Breakpoints mixin pack for Seed

Install

npm install @seedcss/seed-breakpoints --save

Documentation

Check out our documentation of this pack.

Basic Usage

SCSS

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

const gulp = require("gulp");
const sass = require("gulp-sass");
const pathfinder = require("sass-pathfinder");
const pack = require("@seedcss/seed-breakpoints");

gulp.task("sass", function() {
  return gulp
    .src("./sass/**/*.scss")
    .pipe(
      sass({
        includePaths: pathfinder(
          // Other includePaths...
          pack
        )
      })
    )
    .pipe(gulp.dest("./css"));
});

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

// Packs
@import "pack/seed-breakpoints/_index";

Options

The following variables can be found in _config.scss

// Seed Breakpoints :: Config

// Namespaces
$seed-breakpoints-at-namespace: \@ !default;

// Breakpoints
$seed-breakpoints: (
  xs: 0,
  sm: 544px,
  md: 768px,
  lg: 992px,
) !default;

Package Sidebar

Install

npm i @seedcss/seed-breakpoints

Weekly Downloads

37

Version

1.0.1

License

MIT

Unpacked Size

11.6 kB

Total Files

25

Last publish

Collaborators

  • helpscout
  • mecarter