I am creating ember addons and there are few css styles which this addon requires to work properly!

How do i add them so that when a consuming application uses this addon the particular css styles are directly added to the app.css file of the consuming application?

Eg: addon: dropdown-addon requires a style

.active-menu {
    background-color: #4183C4;
}

consuming application: online-form

when online-form is using dropdown-addon i want .active-menu to be added to app.css automatically!

I am creating ember addons and there are few css styles which this addon requires to work properly!

How do i add them so that when a consuming application uses this addon the particular css styles are directly added to the app.css file of the consuming application?

Eg: addon: dropdown-addon requires a style

.active-menu {
    background-color: #4183C4;
}

consuming application: online-form

when online-form is using dropdown-addon i want .active-menu to be added to app.css automatically!

• javascript
• css
• ember.js
• ember-addon
• ember-cli-addons

• Inside the addon directory, create a styles folder. Inside that, create a css file with your addon's styles. They should be included automatically with the consuming app's css. Thats how I did it for my addon. github./blessenm/ember-cli-bm-select/blob/master/addon/… – blessanm86 Commented May 4, 2015 at 12:19
• are you sure? i already tried it but it didn work! Also i tried it with the dummy testing application! Is it meant to work only with consuming application and not the test dummy application? – wallop Commented May 4, 2015 at 12:27
• Well I tried installing my addon on a new app and the addon css was getting appended to the vendor.css file. Im not sure about the dummy app. I need to do a plete check with the latest version of ember and cli. – blessanm86 Commented May 4, 2015 at 14:16
• right let me check it too and get back! – wallop Commented May 4, 2015 at 14:21

1 Answer 1

• Create the file vendor/style.css with your custom css
• In index.js add:

module.exports = {

  //...
  //...

  included: function(app) {
    app.import('vendor/style.css');
  }

  //...
  //...

}

Note: The css code will be added to dist/assets/vendor.css