Agile Web Development with Rails, Edition 4

8.3 Iteration C3: Use a Helper to Format the Price 8.1 Iteration C1: Create the Catalog Listing

8.2 Iteration C2: Add a Page Layout

Expected at least 1 element matching "#banner", found 0.
<0> expected to be
>=
<1>.

Traceback:
  /home/rubys/git/awdwr/edition4/checkdepot.rb:115:in `block in <class:DepotTest>'

Demonstrate layouts.

Modify the application layout

edit app/views/layouts/application.html.erb
<!DOCTYPE html>
<html>
<head>
  <title>Pragprog Books Online Store</title>
  <!-- <label id="code.slt"/> --><%= stylesheet_link_tag    "application", media: "all",
    "data-turbolinks-track" => true %>
  <%= javascript_include_tag "application", "data-turbolinks-track" => true %><!-- <label id="code.jlt"/> -->
  <%= csrf_meta_tags %><!-- <label id="code.csrf"/> -->
</head>
<body class="<%= controller.controller_name %>">
  <div id="banner">
    <%= image_tag("logo.png") %>
    <%= @page_title || "Pragmatic Bookshelf" %><!-- <label id="code.depot.e.title"/> -->
  </div>
  <div id="columns">
    <div id="side">
      <ul>
        <li><a href="http://www....">Home</a></li>
        <li><a href="http://www..../faq">Questions</a></li>
        <li><a href="http://www..../news">News</a></li>
        <li><a href="http://www..../contact">Contact</a></li>
      </ul>
    </div>
    <div id="main">
      <%= yield %><!-- <label id="code.depot.e.include"/> -->
    </div>
  </div>
</body>
</html>

Modify the stylesheet

Rename the application stylesheet so that we can use SCSS

mv app/assets/stylesheets/application.css app/assets/stylesheets/application.css.scss

Add our style rules

edit app/assets/stylesheets/application.css.scss
/*
 * 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_self
 */
 
#banner {
  background: #9c9;
  padding: 10px;
  border-bottom: 2px solid;
  font: small-caps 40px/40px "Times New Roman", serif;
  color: #282;
  text-align: center;
 
  img {
    float: left;
  }
}
 
#notice {
  color: #000 !important;
  border: 2px solid red;
  padding: 1em;
  margin-bottom: 2em;
  background-color: #f0f0f0;
  font: bold smaller sans-serif;
}
 
#columns {
  background: #141;
 
  #main {
    margin-left: 17em;
    padding: 1em;
    background: white;
  }
 
  #side {
    float: left;
    padding: 1em 2em;
    width: 13em;
    background: #141;
 
    ul {
      padding: 0;
 
      li {
        list-style: none;
 
        a {
          color: #bfb;
          font-size: small;
        }
      }
    }
  }
}

Show the results.

get /

Sprockets::Rails::Helper::AssetNotPrecompiled in Store#index

Showing /home/rubys/git/awdwr/edition4/work-42/depot/app/views/store/index.html.erb where line #9 raised:

Asset was not declared to be precompiled in production.
Add `Rails.application.config.assets.precompile += %w( cs.jpg )` to `config/initializers/assets.rb` and restart your server
Extracted source (around line #9):
7
8
9
10
11
12
              
<% @products.each do |product| %>
<div class="entry">
<%= image_tag(product.image_url) %>
<h3><%= product.title %></h3>
<%= sanitize(product.description) %>
<div class="price_line">

Rails.root: /home/rubys/git/awdwr/edition4/work-42/depot

Application Trace | Framework Trace | Full Trace

Request

Parameters:

None

Response

Headers:

None

8.3 Iteration C3: Use a Helper to Format the Price 8.1 Iteration C1: Create the Catalog Listing