How to add css styles in app.css for ember js addon

Question

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!

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