Foundation with Sass: Difference between revisions
Jump to navigation
Jump to search
(Created page with "Category:Sass Category:CSS Category:Web Development == Prerequisites == * Git * Node.js * Ruby 1.9+ == Links == === Reference === * [http://foundation.zurb.c...") |
No edit summary |
||
| Line 1: | Line 1: | ||
[[Category:Sass]] [[Category:CSS]] [[Category:Web Development]] | [[Category:Sass]] [[Category:CSS]] [[Category:Web Development]] | ||
== Installing Foundation == | |||
=== Installing Foundation for Sites 6 === | |||
<syntaxhighlight lang="bash"> | |||
$ npm install --global foundation-cli | |||
</syntaxhighlight> | |||
=== Creating a new project === | |||
<syntaxhighlight lang="bash"> | |||
$ foundation new --framework sites --template basic --directory [app_name] | |||
</syntaxhighlight> | |||
=== Upgrading from earlier versions === | |||
First uninstall the existing Foundation installation | |||
<syntaxhighlight lang="bash"> | |||
$ npm uninstall foundation | |||
</syntaxhighlight> | |||
== 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 [https://github.com/Igosuki/compass-mixins 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 == | == Prerequisites == | ||
Revision as of 02:40, 24 November 2015
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