Sasstarter NPM

Sasstarter

A quick-start responsive framework for frontend development with Sass.

sasstarter

Plugins

Sasstarter use this:

Easing - A jQuery plugin from to give advanced easing options.
FitVids - A lightweight, easy-to-use jQuery plugin for fluid width video embeds.
jQuery - A fast, small, and feature-rich JavaScript library.
Normalize.css - A modern, HTML5-ready alternative to CSS resets.
Modernizr - Modernizr tells you what HTML, CSS and JavaScript features the user’s browser has to offer.
SmartResize - Debounced and Throttled Resize Events for jQuery.

Structure

sasstarter/
│
├── app/
│   │
│   ├── css/
│   │   ├── main.css                (scss output)
│   │   ├── main-responsive.css     (responsive scss output)
│   │   └── normalize.css           (the best of css resets)
│   │
│   ├── img/
│   │   ├── apple-touch-icon.png    (180x180 icon for iphone)
│   │   ├── favicon.ico             (16x16 of pure art)
│   │   └── loading.gif             (fake 'loading' background)
│   │
│   ├── js/
│   │   ├── grid.js                 (the visual guide for your layout)
│   │   ├── jquery.js               (jquery library)
│   │   ├── main.js                 (for your functions and shit)
│   │   ├── modernizr.js            (html5 + css3 for the masses)
│   │   └── plugins.js              (you can add more plugins here)
│   │
│   ├── scss/
│   │   ├── main.scss               (basic sass configuration)
│   │   └── main-responsive.scss
│   │       ├── 4col                (mobile - portrait view)
│   │       ├── 6col                (mobile - landscape view)
│   │       ├── 9col                (for devices with 800 wide)
│   │       ├── 12col               (for devices with 1024 wide)
│   │       └── 16col               (for devices with 1280+ wide)
│   │
│   ├── .htaccess                   (error handling)
│   ├── index.html                  (duh!)
│   └── robots.txt                  (all your base are belong to us)
│
├── build/                          (generated folder with 'gulp build' task)
│
├── .editorconfig                   (keep the code clean and organized)
├── .gitignore                      (wow. ignore. such. files.)
├── .jshintrc                       (jshint rules)
├── README.md                       (you're reading it right now)
├── gulpfile.js                     (gulp tasks)
└── package.json                    (npm devdependencies)