ember-body-class

3.0.0 • Public • Published

npm version Travis CI

ember-body-class

Easily add CSS classes on the <body>, including route names as well as loading and error states.

Compatibility

  • Ember.js v2.16 or above
  • Ember CLI v2.16 or above
  • Node.js v10 or above

Installation

ember install ember-body-class

Usage

  • npm run lint:hbs
  • npm run lint:js
  • npm run lint:js -- --fix

Route name classes

By default, all of your routes will include CSS class names. This works for the whole hierarchy, so if you have a route nested at application/dashboard/stats, then you'll end up with application, dashboard, stats, application-dashboard and application-dashboard-stats classes.

To disable this, see options below.

Loading & Error classes

Adding the loading and error classes requires you to include a mixin in your application route. Include it like this:

import Ember from 'ember';
import BodyClassMixin from 'ember-body-class/mixins/body-class';

export default Ember.Route.extend(BodyClassMixin, { });

Custom classes

All routes have a classNames attribute of type Array. If you wanted to add a class strawberry-jam to your route, it would look like this:

export default Ember.Route.extend({
  classNames: ["strawberry-jam"]
})

Options

You can disable route name classes being added in your environment.js like this.

ENV['ember-body-class'] = {
  includeRouteName: false
}

Contributing

See the Contributing guide for details.

License

This project is licensed under the MIT License.

Package Sidebar

Install

npm i ember-body-class

Weekly Downloads

2,274

Version

3.0.0

License

MIT

Unpacked Size

234 kB

Total Files

67

Last publish

Collaborators

  • real_ate