Foundation with Sass

CDN

CDNs for stubbing out projects.

• //cdn.foundation5.zurb.com/foundation.css
• //cdn.foundation5.zurb.com/foundation.js

or

• //cdnjs.cloudflare.com/ajax/libs/foundation/5.5.0/js/foundation.min.js
• //cdnjs.cloudflare.com/ajax/libs/foundation/5.5.0/css/foundation.min.css

Installing Foundation with Sass

$ npm install --global foundation-cli

Creating a new project

$ foundation new --framework sites --template basic --directory [app_name]

Upgrading from earlier versions

First uninstall the existing Foundation installation

$ npm uninstall foundation

Compiling Sass

Foundation 6 uses gulp to compile.

Creating a new Foundation project creates a gulpfile.js in the project directory. The default action is to watch for changes in .scss and .js files, so simply running gulp will spawn a process that will compile the project.

Compiling Compass

I couldn't figure out a way to use config.rb to use the compass compile command with the Foundation for Sites 6 libraries. It's necessary to use the gulp task.

These Compass mixins emulate the compass mixins. Download them and place the lib directory in the project's scss/ directory. Then e.g. include with @include "compass-mixins\compass\animation";

Prerequisites

• Git
• Node.js
• Ruby 1.9+

Links

Reference

• Getting Started with Foundation and Sass - Foundation Documentation