Foundation with Sass

Installing Foundation

Installing Foundation for Sites 6

$ 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