CODEWITHSUNDEEP
ruby-on-rails
Mike
Mike

Reputation: 374

How do I add CSS to Ruby On Rails?

I can't figure out how to add CSS to my Ruby On Rails code.

This is my index.html.erb file where I attempt to include the stylesheet.

<!DOCTYPE html>

<html>

    <head>
        <%= stylesheet_link_tag "app\assets\stylesheets\welcome.scss" %>
    </head>

    <body>
        <h1>Welcome To Dot</h1>
        <p>Make Life Easier</p>
    </body>
</html>

Inside of the assets\stylesheets folder I have a welcome.scss file:

h1{
    font-size:30px;
    font-weight: bold;
    font-family: fantasy;
    color: darkgoldenrod;
    text-align: left;
}

The body shows up but does not have any styling.

application.html:

<!DOCTYPE html>
<html>
<head>
  <title>Dot</title>
  <%= stylesheet_link_tag    'default', media: 'all', 'data-turbolinks-track'       => true %>
  <%= javascript_include_tag 'default', 'data-turbolinks-track' => true %>
  <%= csrf_meta_tags %>
</head>
<body>

<%= yield %>

</body>
</html>

When leave it as default, I do not see any CSS in my code. When I change it to application, i get the error.

Upvotes: 2

Views: 8982

Answers (3)

Micael Illos
Micael Illos

Reputation: 492

You need to delete your stylesheet tag on your index.html.erb and in your application.html.erb Have a stylesheet link tag like this : <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>. -- if that doesn't help , you should check what is written after application/default <filename>.css Scss must not be written for now.. <filename>.scss That worked for me

Upvotes: 0

Ruby Doggy
Ruby Doggy

Reputation: 109

You must have <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %> to the layouts/application.html.erb file. You don't have to put to any other file css tags. Yield do the job. application.html.erb loaded to any view of your app.

Upvotes: 0

lorefnon
lorefnon

Reputation: 13095

You should write: 

<%= stylesheet_link_tag "welcome" %>

Please consider going through the Rails guides on the Asset pipeline that elaborate on using asset helpers to include assets in HTML page.

Upvotes: 3

Related Questions