How do you associate a css/sass stylesheet to a view in rails?
The best way would be to put a named yield in your application layout:
<%= yield :head %>
Then use a content for block in your view:
<% content_for :head do %>
<%= stylesheet_link_tag :my_css -%>
<% end %>
using a different style for different views in rails
The styles and javascripts are loaded from your layout. Out of the box it looks like this:app/views/layouts/application.html.erb
<%= stylesheet_link_tag 'application', media: 'all' %>
<%= javascript_include_tag 'application' %>
If you only want to include particular css files in a particular view, you would need to:
- Create a layout for your particular view.
- Include the appropriate styles and javascripts in the layout.
- Specify the particular layout in your controller.
Here is some more information on layouts, but lets go through it for your login example.
app/controllers/sessions/create
class SessionsController < ApplicationController
layout 'login', only: [:new]
# you could also call the layout "sessions.html.erb" and it will be
# loaded automagically
If you want to use a different layout for different actions in the same controller, you can add other layout methods and specify the actions they apply to with the only
action.
Then the layout
app/views/layouts/login.html.erb
...
<%= stylesheet_link_tag 'login', media: 'all' %>
...
And finally your stylesheet
app/assets/stylesheets/login.scss
@import "file_you_want";
If you require_tree .
it will load all styles in the stylesheets directory which I don't think is what you are after.
Adding a specific stylesheet to a single Rails page
One way would be to target your controller and action using CSS classes.
In your app/views/layouts/application.html.erb, add controller_name
and action_name
method calls to generate the CSS classes.
<body class="<%= controller_name %> <%= action_name %>">
CSS
html { height: 100% }
body.home {
height: 100%;
background: url('assets/image.jpg') no-repeat center center;
background-size: cover;
font-family: Arial;
}
.home h1 {
color: black;
font-style: bold;
text-align: center;
}
Rails How to include a scss file in a specific erb view?
Because you are including it independently, and not including it in your application.css
. The default for the asset pipeline is to compile applicaiton.css/application.js
and anything that is included in those files.
/*
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
*
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
* or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
*
* You're free to add application-wide styles to this file and they'll appear at the bottom of the
* compiled file so the styles you add here take precedence over styles defined in any styles
* defined in the other CSS/SCSS files in this directory. It is generally better to create a new
* file per style scope.
*
*= require_tree .
*= require c3
*= require purecss
*= require_self
*= require pure_css_reset
*/
If you want it to be seperate and not compiled into the one monolithic file, being called from your stylesheet_link_tag
, you have to manually add it to the precompile array.
http://guides.rubyonrails.org/asset_pipeline.html#precompiling-assets is a good reference.
Rails - How to set 1 scss file for 1 view
The most important piece you are probably missing is that Sprockets won't serve any asset, mainly the css and js need to be declared in your asset manifest. Quoting the docs:
If you have other manifests or individual stylesheets and JavaScript files to include, you can add them to the precompile array in config/initializers/assets.rb:
Rails.application.config.assets.precompile += ['admin.js', 'admin.css', 'swfObject.js']
Use the expected resulting name (with .css
extension) and not the source file (with the .scss
extension).
How to link scss file with style sheet link tag in Ruby on Rails
Only application.css.scss
is precompiled by default. All files that are required through this file are also compiled. Normally, you would request your other files from within this file using either *= require_tree
and *= require_self
or @import
.
If you still want to explicitly include the main.css.scss
using stylesheet_link_tag
like in your question, you need to add it to your list of precompiled assets in config/initializers/assets/
like so:
Rails.application.config.assets.precompile += %w( main.css )
How do I use Controller specific stylesheets in Rails 3.2.1?
I don't think it works that way (Home.css
being applied only to Home
controller actions). The different files are just for separation, to make it clearer what are the CSS rules describing. You can read this guide about the asset pipeline. I'm guessing you altered the default application.css.scss
and removed the line importing all CSS files from app/assets/stylesheets
.
Rails3.1 - How do I include css files in some views but not others?
In Rails 3.1, all your stylesheets will be merged into the application.css if your application.css looks like:
/*
* This is a manifest file that'll automatically include all the stylesheets available in this directory
* and any sub-directories. You're free to add application-wide styles to this file and they'll appear at
* the top of the compiled file, but it's generally better to create a new file per style scope.
*= require_self
*= require_tree .
*/
It's due to the *=require_tree .
You can require a specific stylesheet with:
*= require main
Otherwise, in your layout, you write:
%head
= yield :head
and in your page:
= content_for :head do
= stylesheet_link_tag 'stylesheet'
Related Topics
Rubymine Error: Unable to Run Gem 'Rails'. Cannot Find 'Rails'
How to Restart Rails from Within Rails
Download File from S3 to Rails 4 App
Is There a Definitive Reference Document for Ruby Syntax
Thin Doesn't Respond to Sigint or Sigterm
Ruby, How to Add a Param to an Url That You Don't Know If It Has Any Other Param Already
Undefined Method 'Devise' When Including User Model Outside Rails
Passing Local Variables to a View from Controller
How to Do a Before_Action in Ruby (Like in Rails)
How to Ensure a Rake Task Only Running a Process at a Time
Gem Install Rails Does Not Install Rails
What's the Best Way to Start a Background Process, That Can Get Accessed Later On
Where Is the Best Place to Add Methods to the Integer Class in Rails