Different Background Color for Different Pages in Rails

Different background color for different pages in rails

Expanding on the answer provided by @muffinista:
You can use an instance variable set in the controller to determine when to put the 'homepage' class on the body tag. So:

def index
  @home_page = true
  # existing code
end

and in the layout:

<body class="<%= @home_page ? 'homepage' : ''%>">
 <%= yield %>
</body>

change body background depending on the page rails

It was my understanding that the page css only loads in when you are on that page

The CSS which loads is dependent entirely upon the stylesheet_link_tag in your layout:

#app/views/layouts/application.html.erb
<%= stylesheet_link_tag :application %>

The way in which you load this determines the stylesheets which load each page.

For example, the standard Rails way to load your stylesheets is to use the "sprockets" files & directives to append the required files into your application.css sheet. Although this works in any other sheet, it's mainly used with application.

Since you're using bootstrap (which tells you the following):

#app/assets/stylesheets/application.css
/*
 *= require bootstrap_and_overrides
*/

... you'll need to make sure you know which files you want to load. Specifically, your assertion that page-specific CSS being loaded is false; you either hard-code the loads, or put the code into a single file (EG application):

#app/views/layouts/application.html.erb
<%= stylesheet_link_tag :application, controller_name #=> loads controller CSS page each time you load a new controller %>

For you, I would do the following:

#app/views/layouts/application.html.erb
<body class="welcome if action_name == 'welcome'">

Then you'd be able to use the following:

#app/assets/stylesheets/application.css
body.welcome {background:#000000;}

Change background color of just one page (and all other pages stay the same)

on way of doing this is rendering a different layout on that page

on your controller

  def something
    render :layout => 'new_layout'
  end

you can also pass a yeald block to over right the css on that pge

in your layout file

<%= stylesheet_link_tag %>
<%= yield(:head) %>

on the view you want to update

<% content_for :head do %>
  <style>
    body {
      background-color: #b0c4de;
    } 
  </style>
<% end %>

Rails: How to apply background-color to body

I think your issue is that CSS is loaded incorrectly. Make sure your CSS is loading. Right click on your page in chrome and go to 'element inspect'. Then in the right menu you can check if your CSS is loaded, which it will probably not. For more info on the inspector, check here: https://developers.google.com/web/tools/chrome-devtools/iterate/inspect-styles/?hl=en

Next, in your application.css you should be able to find the structure and sequence via which rails loads your css files. Look for something like this and make sure the "reset" is mentioned as first and your custom somewhere at the bottom.

    *= require reset
    *= require flexboxgrid
    ...
    *= require custom

Once the custom css file is loaded last (at the bottom in the application.css file), you can add in the custom.css file:

   body {
      background: red;
    }

Rails 4 Alternate Background for Row Item

Try to check if products.css.scss is loaded. You can put your styles to the application.css.scss to check if it resolves the issue.

Ruby on Rails change background colour in CSS according to database

If you try to change the body background color, then try this:

<body style="background-color: <%= @colour %>">

</body>

But it will make some consequences for you and you will need to go deeper :)

It will be better to do it this way

<body style="background-color: <%= @colour if @colour %>" >

</body>

or just write a helper.

Different Background Color for Different Pages in Rails