Adding route specific body class tags in Ember

tags
Brian Cardarella

CEO & Founder

Brian Cardarella

Our designer likes to use body class tags depending upon the context of the app he is designing. We’re currently building an Ember app and this is how I got it working:

Ember.Route.reopen({
  activate: function() {
    var cssClass = this.toCssClass();
    // you probably don't need the application class
    // to be added to the body
    if (cssClass != 'application') {
      Ember.$('body').addClass(cssClass);
    }
  },
  deactivate: function() {
    Ember.$('body').removeClass(this.toCssClass());
  },
  toCssClass: function() {
    return this.routeName.replace(/\./g, '-').dasherize();
  }
});

        
          
        
      

Newsletter

Stay in the Know

Our latest articles and insights on all things digital product innovation, delivered straight to your inbox.

Narwin holding a press release sheet while opening the DockYard brand kit box