An ember-cli addon for using Materialize (CSS Framework based on Material Design) in Ember applications.
Ember 2.0 Friendly
Materialize Version ~0.97.0
Ember.js version | ember-cli-materialize version |
---|---|
< 1.10.0 |
Not supported |
1.10.0 <= x < 1.11.0 |
v0.16.4 |
x >= 1.11.0 |
- Imports Materialize sass (via ember-cli-sass) and fonts into your app.
- It's a components library for all Materialize components
The online demo demonstrates all components with all possible options.
Or you can download the demo:
$ sudo npm install -g ember-cli
$ git clone git@github.com:mike-north/ember-cli-materialize
$ cd ember-cli-materialize
# install dependencies
$ npm install && bower install
# fire up local server
$ ember serve
Using SASS makes configuring the color scheme simple. Just make sure you import components/color
and components/variables
before materialize
like the example below.
// Example app.scss
@import 'components/color';
@import 'components/variables';
// Custom color settings go here
$primary-color: color("pink", "lighten-2");
@import 'materialize';
@import 'ember-cli-materialize';
See the materialize docs on sass variables here.
Some of the library's defaults can be set via your config/environment.js file
module.exports = function(/* environment, appConfig */) {
var ENV = {
materializeDefaults: {
modalIsFooterFixed: false,
buttonIconPosition: 'left',
loaderSize: 'big',
loaderMode: 'indeterminate',
modalContainerId: 'materialize-modal-root-element',
dropdownInDuration: 300,
dropdownOutDuration: 300
},
...
};
}
$ ember install ember-cli-materialize
This addon is continuiously integrated against the following framework versions
Version | Failures Allowed |
---|---|
Ember ~1.10.0 |
No |
Ember ~1.11.0 |
No |
Ember ~1.12.0 |
No |
components/ember#release | No |
components/ember#beta | No |
components/ember#canary | No |
See CONTRIBUTING file.
Special thanks to Stefan Gasser for creating and originally maintaining this great library
ember-cli-materialize is released under the MIT License. See the bundled LICENSE file for details.