Style sheet references
I am new to Sinatra and am trying to reference a stylesheet from an ERB file. I've tried the methods used in Loading Styles in Sinatra "but the stylesheet still won't load.
My HTML is in views / index.rb and my stylesheet is in views /styles/main.css. The controller logic is in app.rb.
The HTML itself is displayed when I upload it to my local server.
Folder structure:
|-- app.rb
|-- config.ru
|-- Gemfile
|-- Gemfile.lock
|-- lib
|-- spec
| |-- spec_helper.rb
|-- views
| |-- index.erb
| |-- styles
| | |-- main.css
app.rb:
get '/' do
erb :index
end
index.erb doesn't work:
<link href="<%= url('views/styles/main.css') %>" rel="stylesheet" type="text/css" />
<link href="<%= url('/main.css') %>" rel="stylesheet" type="text/css" />
My repo: https://github.com/natstar93/Thermostat-day3
Can someone help me figure out how to reference the stylesheet?
source to share
Static assets like style sheets should be in a directorypublic
, not views
one that is for templates that produce different output for each query.
You should create a directory with a name public
next to views
and copy the directory into it styles
. Then the URL of the stylesheet would be /styles/main.css
:
<link href="<%= url('/styles/main.css') %>" rel="stylesheet" type="text/css" />
You may also need to enable a static service resource (the docs show it is disabled by default in modular applications, but it really depends on whether the dir exists public
- it cannot be explicit). Add this to your application class to include this:
enable :static
source to share