Skip to content
Material Design (via Materialize) for Ember.js Apps
JavaScript HTML CSS Shell
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.github/ISSUE_TEMPLATE
.vscode
addon
app Prettier Jan 4, 2018
blueprints feat: remove ember-new-computed dependency Mar 3, 2019
config
lib gh-pages demo in ember-1.12 Aug 17, 2015
tests feat: remove ember-new-computed dependency Mar 3, 2019
vendor Blanket coverage Aug 15, 2015
.bowerrc Initial Commit from Ember CLI v0.1.4 Dec 20, 2014
.editorconfig
.ember-cli Initial Commit from Ember CLI v0.1.4 Dec 20, 2014
.eslintignore chore: update ember-try testing scenarios Nov 10, 2018
.eslintrc.js chore: revert eslint changes Nov 10, 2018
.gitignore chore: revert eslint changes Nov 10, 2018
.jscsrc Update dependencies (#322) Apr 22, 2016
.jshintrc Initial Commit from Ember CLI v0.1.4 Dec 20, 2014
.npmignore chore: revert eslint changes Nov 10, 2018
.prettierrc
.template-lintrc.js chore: revert eslint changes Nov 10, 2018
.travis.yml chore: replace travis-deploy-once with travis-ci stage Dec 5, 2018
.watchmanconfig update ember-cli Feb 1, 2016
CHANGELOG.md chore(release): 0.24.0 [skip ci] Mar 3, 2019
CONTRIBUTING.md Initial Commit Dec 22, 2014
LICENSE.md
README.md docs(readme): add Greenkeeper badge Jan 3, 2018
app.json
bower.json Ember 2.18 Jan 4, 2018
ember-cli-build.js Prettier Jan 4, 2018
index.js Ember 2.18 Jan 4, 2018
jsconfig.json Fix broken tests Jan 4, 2018
package.json
renovate.json feat: upgrade to ember 3 Nov 10, 2018
testem.js
yarn.lock chore(deps): ember-ajax Jun 7, 2019

README.md

ember-cli-materialize

Greenkeeper badge

Build Status npm version Code Climate Coverage Status Ember Observer Score Book session on Codementor

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

NPM

Which version do I use?

Ember.js version ember-cli-materialize version
< 1.10.0 Not supported
1.10.0 <= x < 1.11.0 v0.16.4
1.11.0 <= x < 1.13.0 v0.18.6
x >= 1.13.0 npm version

Main features

  • Imports Materialize sass (via ember-cli-sass) and fonts into your app.
  • It's a components library for all Materialize components

Usage

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

Configuration

Style

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';

// Custom color settings go here
$primary-color: color("pink", "lighten-2");

@import 'components/variables';
@import 'materialize';
@import 'ember-cli-materialize';

See the materialize docs on sass variables here.

Defaults

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
    },
    ...
  };
}

Installation

$ ember install ember-cli-materialize

PhantomJS

If you are using PhantomJS version 1.9.x as a test runner then after installing this addon you may experience test failures when running tests via ember test that you do not see in a browser.

This is due to the known limitation in PhantomJS 1.9 not providing a .bind method. To continue using PhantomJS simply either install ember-cli-es5-shim, which provides a .bind method, or try PhantomJS 2.x.

Testing

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

Contributing

See CONTRIBUTING file.

Special Thanks

Special thanks to Stefan Gasser for creating and originally maintaining this great library

License

ember-cli-materialize is released under the MIT License. See the bundled LICENSE file for details.

Analytics

You can’t perform that action at this time.