Repo currently unmaintained!
Due to lack of time, we are currently unable to maintain this project. We are, however, happy to continue accepting pull requests.
Especially welcome:
- Tests
Ember CLI Foundation SASS Addon
Tested against ember-cli > v2.0.0 If you want to use it with ember-cli >=0.1.2, use v1.2.0 of the addon. If you want to use it with ember-cli >=0.0.44, use v0.3.3 of the addon.
This addon automates the steps to include SASS with Foundation 5.5.0 into your ember-cli app using ember-cli-sass as well as simplifying the customization of the settings and which components you want to include.
It also installs broccoli-clean-css, purely for convenience since it generally seems to lead to the best minification results: http://goalsmashers.github.io/css-minification-benchmark/.
Usage
Installation
ember install ember-cli-foundation-sass
Installation (ember-cli < 0.1.5)
npm install ember-cli-foundation-sass --save-dev
ember g ember-cli-foundation-sass
- If you clone an existing project with this addon, just run
npm i && bower i
.
What It Does
Running the blueprint installs Foundation 5.5.0 via Bower, copies over the _settings.scss
as well as the foundation.scss
to your app/styles
folder.
It also creates a default app.scss
that imports the _settings.scss
as well as the _foundation.scss
, so you can serve the app immediately. Lastly, it installs the already mentioned dependencies ember-cli-sass and broccoli-clean-css.
This setup is made so you don't have to worry about how to customize Foundation, but just lets you do it. Furthermore ember-cli-sass helps that the foundation import
statements (in the _foundation.scss
) 'just' work.
Options
This addon provides an API to simplify adding the Foundation JavaScript modules and dependencies:
//Brocfile.js//Includes modernizr, fastclick and the full foundation.js with all modulesvar app = 'ember-cli-foundation-sass': 'modernizr': true 'fastclick': true 'foundationJs': 'all' ; //Includes the core foundation.js with the tab, topbar, orbit and dropdown modulevar app = 'ember-cli-foundation-sass': 'foundationJs': 'tab' 'topbar' 'orbit' 'dropdown' ; //Includes just the core foundation.js without any modulesvar app = 'ember-cli-foundation-sass': 'foundationJs': true ;
Whenever you use any foundation JS module in your code, make sure that view/component includes the following:
; View;