Search code examples
javascripthtmlcssmeteoriron-router

Adding a Background color in iron router

I have two separate pages I am trying to add a background color to whilst using Iron Router, so the html has no tags to use.

I see that Router.onBeforeAction(function() {

}); exists and that seems to be the way to do this.

So any thoughts on how to add the CSS styling would be greatly thanks.

Router.configure({
    layoutTemplate: 'layout'
});

Router.map(function(){
    this.route('Main', {path: '/', data: {title: 'Contacts Admin'}, name: 'mainlanding'});
    this.route('Contact', {path: '/Contact', data: {title: 'Contacts List'}, name: 'contactlanding'});
});
Solution

  • Something like this in your route:

    js:

    onAfterAction: function(){
  $('.mySpecialClass').remove('mySpecialClass'); // undo what was done before
  $('body').addClass('mySpecialClass'); // add a class
}

    css:

    .mySpecialClass {
  background-color: "red";
}