Try showing food lists as sentences.

I've also tightened up some of the spacing in the other information sections, particularly to remove any margin that appears at the very bottom of the page.
jamesweiner · Jun 10, 2012 · 752778a · 752778a
1 parent f4b4d6c
commit 752778a
Show file tree

Hide file tree

Showing 3 changed files with 41 additions and 25 deletions.
diff --git a/app.rb b/app.rb
@@ -7,6 +7,15 @@ def current_month
   Date::MONTHNAMES[Date.today.month][0,3].downcase
 end
 
+helpers do
+  def to_sentence(list)
+    list.map! {|i| "<span class='item'>#{i}</span>" }
+    last_ones = list.pop, list.pop
+    list.push(last_ones.compact.reverse.join(" and "))
+    list.join(", ")
+  end
+end
+
 get "/" do
   url = "http://api.scraperwiki.com/api/1.0/datastore/sqlite?format=jsondict&name=bbc_seasonal_foods_by_month&query=select%20*%20from%20%60swdata%60"
   data = MultiJson.decode(open(url).read).inject({}) { |h, d| h[d["name"]] = d; h }

diff --git a/public/style.css b/public/style.css
@@ -89,6 +89,23 @@ ul {
   margin-bottom: 1.5rem;
 }
 
-.in-season, .last-chance, .out-of-season {
-  font-size: 1.5rem;
+.other-foods section {
+  margin-top: 1em;
+}
+
+.other-foods section:first-child {
+  margin-top: 0;
+}
+
+.other-foods h2 {
+  margin-top: 0;
+  margin-bottom: 0.2em;
+}
+
+.other-foods p {
+  margin: 0;
+}
+
+.other-foods .item {
+  font-style: italic;
 }
diff --git a/views/publication.erb b/views/publication.erb
@@ -42,29 +42,19 @@
           <p>Stuffed Tomatoes: scoop 4lrg toms. Mince insides/shallot/8olives; mix+2c cookedrice/3T mayo&pinenuts/T olvoil/s+p. Fill toms. 20m@400F/200C.</p>
           <p class="credit">Recipe from @Cookbook - Maureen Evans, author of Eat Tweet, published by Artisan Books (2010).</p>
         </section>
-        <section class="in-season">
-          <h2>Also now in season</h2>
-          <ul>
-            <% @now_in_season.each do |item| %>
-              <li><%= item %></li>
-            <% end %>
-          </ul>
-        </section>
-        <section class="last-chance">
-          <h2>Last chance to eat</h2>
-          <ul>
-            <% @last_chance.each do |item| %>
-              <li><%= item %></li>
-            <% end %>
-          </ul>
-        </section>
-        <section class="out-of-season">
-          <h2>Now out of season</h2>
-          <ul>
-            <% @now_out_of_season.each do |item| %>
-              <li><%= item %></li>
-            <% end %>
-          </ul>
+        <section class="other-foods">
+          <section class="in-season">
+            <h2>Also now in season</h2>
+            <p><%= to_sentence @now_in_season %></p>
+          </section>
+          <section class="last-chance">
+            <h2>Last chance to eat</h2>
+            <p><%= to_sentence @last_chance %></p>
+          </section>
+          <section class="out-of-season">
+            <h2>Now out of season</h2>
+            <p><%= to_sentence @now_out_of_season %></p>
+          </section>
         </section>
       </div>
     </div>