Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to make my background image appear only on one page in rails 4?

I have a background image that I can not get to stay just on one page. I have made a welcome controller with one home view to display it. I am precompiling my assets as well. The background shows up just fine, but my goal is to just show the background image on my home.html.erb view.

welcome/home.html.erb:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<%= I18n.locale || 'en' %>"    

lang="<%= I18n.locale || 'en'%>">
<body class="container">
<h1>title</h1>
</body>

</html>

welcome controller:

class WelcomeController < ApplicationController
 def home
 end
end

stylesheets/welcome.css.scss:

body 
{
background: {
image: asset-url("image.jpg");
 }
}

and I have the following in my application layout:

<head>
<%= stylesheet_link_tag "welcome" if controller_name == "welcome" %>
</head>

and in config/initializers/assets.rb :

Rails.application.config.assets.version = '1.0'


Rails.application.config.assets.precompile += %w( welcome.css )
like image 954
dobsoft Avatar asked Sep 05 '14 16:09

dobsoft


2 Answers

Add specific css,

body.welcome 
{
  background: {
   image: asset-url("image.jpg");
 }
}

and in html,

 <body class="container welcome"> 

You must be wondering even though you have not included specific file then why it is applying all over. This is because you must have specified require_tree . in application.css

like image 144
maximus ツ Avatar answered Sep 30 '22 15:09

maximus ツ


In Rails: Try creating a css class for the background image

.splash {
  background-image: image-url("image.jpeg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

If you want all pages to display the image

<html class="splash"> ... </html>

But on one page only, on that view page, wrap everything in

<body class="splash"> ... </body>
like image 21
foureyedraven Avatar answered Sep 30 '22 14:09

foureyedraven