Ada-C4 · rmtolmach · Oct 29, 2015 · Oct 30, 2015 · Oct 30, 2015 · Nov 2, 2015
diff --git a/.DS_Store b/.DS_Store
diff --git a/Procfile b/Procfile
@@ -0,0 +1 @@
+web: bundle exec rackup -p $PORT
diff --git a/my-site.rb b/my-site.rb
@@ -3,18 +3,22 @@
 class MySite < Sinatra::Base
 
   get "/" do # these are route routes
+    @t = Time.new
     erb :index
   end
 
   get "/projects" do
+    @t = Time.new
     erb :projects
   end
 
   get "/about" do
+    @t = Time.new
     erb :about
   end
 
   get "/blog" do
+    @t = Time.new
     erb :blog
   end
 

diff --git a/public/african-coconut-curry.jpg b/public/african-coconut-curry.jpg
diff --git a/public/css/style.css b/public/css/style.css
@@ -0,0 +1,140 @@
+section{
+  width: 960px;
+  margin: auto;
+}
+/* below are styles for header */
+body {
+  background-color: #edcb32;
+  margin: 0;
+}
+
+.head-foot {
+  background-color: #ef4229;
+  padding: 5px;
+  text-align: center;
+}
+
+h3 {
+  text-align: center;
+  font-size: 2em;
+  font-family: monospace, sans-serif;
+}
+
+#navigation li {
+  display: inline;
+  padding: 20px;
+}
+
+a {
+  text-decoration: none;
+  color: black;
+  font-size: 1.3em;
+  font-family: helvetica, sans-serif;
+}
+
+a:hover {
+  color: #edcb32;
+}
+
+/* below are styles for main body */
+#welcome {
+  text-align: center;
+  font-family: helvetica, sans-serif;
+}
+
+h1 {
+  font-size: 4em;
+  font-family: helvetica, sans-serif;
+}
+
+.kitchen {
+  display: block;
+  margin: auto;
+  border-top-left-radius: 155px;
+  border-bottom-right-radius: 155px;
+}
+
+.tag-line {
+  font-size: 1.2em;
+  font-family: helvetica, sans-serif;
+  width: 750px;
+  margin: 30px auto;
+}
+
+.project-nav:hover {
+  color: #ef4229;
+}
+
+/* below are styles for main body of projects */
+.ingredients {
+  width: 450px;
+  margin: 40px;
+}
+
+.recipe {
+  font-family: helvetica, sans-serif;
+  margin-bottom: 20px;
+
+}
+.margarita {
+  padding-top: 30px;
+}
+
+.food-pics {
+  padding: 30px;
+}
+
+hr {
+  border: 0;
+  height: 1px;
+  background: #333;
+  background-image: linear-gradient(to right, #ccc, #333, #ccc);
+}
+
+/* below are styles for main body of about */
+.chris-rock {
+  display: block;
+  margin: auto;
+}
+
+h2 {
+  font-family: helvetica, sans-serif;
+}
+
+.guns {
+  font-family: helvetica, sans-serif;
+}
+
+table {
+    border-collapse: collapse;
+    margin: auto;
+    margin-bottom: 30px;
+}
+
+table, th, td {
+    border: 2px solid black;
+    font-size: 1.4em;
+    font-family: helvetica, sans-serif;
+
+}
+
+td {
+  padding: 7px;
+}
+
+/* below are styles for main body of blog */
+.blog-post {
+  font-family: helvetica, sans-serif;
+  font-size: 1.1em;
+  line-height: 1.4em;
+}
+
+/* below are styles for footer */
+.social-link {
+  font-size: 1em;
+}
+
+.social-footer {
+  font-family: helvetica, sans-serif;
+  font-size: 1.1em;
+}
diff --git a/public/fatty2.png b/public/fatty2.png
diff --git a/public/fatty3.png b/public/fatty3.png
diff --git a/public/fatty4.png b/public/fatty4.png
diff --git a/public/fatty5.png b/public/fatty5.png
diff --git a/public/gj.png b/public/gj.png
diff --git a/views/about.erb b/views/about.erb
@@ -1,57 +1,35 @@
-<html>
-  <head>
-    <title>Food</title>
-    <meta charset = "utf-8">
-  </head>
-
-  <body>
-    <header>
-      <h3>This is where hungry people hang out.</h3>
-      <ul>
-        <li><a href="/">Homepage</a></li>
-        <li><a href ="projects">Projects</a></li>
-        <li><a href="about">About</a></li>
-        <li><a href="blog">Blog</a></li>
-      </ul>
-    </header>
-
-    <h1>ALL ABOUT MEEEEEE!!!</h1>
-    <img src="giphy.gif" alt="chris rock dancing gif"/>
+<h1>ALL ABOUT MEEEEEE!!!</h1>
+  <img class="chris-rock" src="giphy.gif" alt="chris rock dancing gif"/>
     <h3>Guns, bad. Chris Rock, good.</h3>
-    <p>Speaking of guns and Chris Rock, <a href=https://youtu.be/OuX-nFmL0II>this is funny</a>.</p>
-    <h2>Here are some more dichotomus things in...</h2>
-    <h3>The World According to Becca:</h3>
-    <table>
-      <tr>
-        <th>THING</th>
-        <th>STATUS</th>
-      </tr>
-      <tr>
-        <td>Sleep</td>
-        <td>Good</td>
-      </tr>
-      <tr>
-        <td>Smelly people on the bus</td>
-        <td>Bad</td>
-      </tr>
-      <tr>
-        <td>My computer</td>
-        <td>Good</td>
-      </tr>
-      <tr>
-        <td>The beach</td>
-        <td>Sandy</td>
-      </tr>
-      <tr>
-        <td><img src="fatty.png"></td>
-        <td>Best</td>
-      </tr>
-    </table>
+      <p class="guns">Speaking of guns and Chris Rock, <a class="project-nav" href=https://youtu.be/OuX-nFmL0II>this is funny</a>.</p>
+        <h2>Here are some more dichotomus things in...</h2>
+          <h3>The World According to Becca:</h3>
+            <table>
+              <tr>
+                <th>THING</th>
+                <th>STATUS</th>
+              </tr>
+              <tr>
+                <td>Sleep</td>
+                <td>Good</td>
+              </tr>
+              <tr>
+                <td>Smelly people on the bus</td>
+                <td>Bad</td>
+              </tr>
+              <tr>
+                <td>My computer</td>
+                <td>Good</td>
+              </tr>
+              <tr>
+                <td>The beach</td>
+                <td>Sandy</td>
+              </tr>
+              <tr>
+                <% pic_array = ["fatty.png", "fatty2.png", "fatty3.png", "fatty4.png", "fatty5.png", "gj.png"] %>
+                <% rand_pic = pic_array[rand(pic_array.length)] %>
+                <td><img src= <%= rand_pic %> ></td>
+                <td>Best</td>
+              </tr>
 
-    <footer>
-      <h3>Food: The only reason to get up in the monring</h3>
-      <p>Follow me on <a href="https://twitter.com/BeccaTmac">Twitter,</a>
-         or stalk me on <a href="https://instagram.com/b2ecca2/">Instagram</a></p>
-    </footer>
-  </body>
-</html>
+            </table>
diff --git a/views/blog.erb b/views/blog.erb
@@ -1,34 +1,23 @@
-<html>
-  <head>
-    <title>Food</title>
-    <meta charset = "utf-8">
-  </head>
+<h1>Becca's Blog: An excuse to talk about food more.</h1>
+  <h3>Food, explained</h3>
 
-  <body>
-    <header>
-      <h3>This is where hungry people hang out.</h3>
-      <ul>
-        <li><a href="/">Homepage</a></li>
-        <li><a href ="projects">Projects</a></li>
-        <li><a href="about">About</a></li>
-        <li><a href="blog">Blog</a></li>
-      </ul>
-    </header>
+    <p class="blog-post">
+      I know you don't want to to know this, that's what you always say when someone brings up the topic of where your food comes from. But you can't be blind to this forever!<br>But don't take it from me. <a class="project-nav" href="http://www.eatinganimals.com/site/book/">Jonathan Safran Foer</a> did his research. And he will give me content for my blog:</p>
 
-    <h1>Becca's Blog: An excuse to talk about food more.</h1>
-    <h3>Meat, explained</h3>
-      <p>
-        I know you don't want to to know this, that's what you always say when someone brings up the topic of where your food comes from. But you can't be blind to this forever!<br>But don't take it from me. <a href="http://www.eatinganimals.com/site/book/">Jonathan Safran Foer</a> did his research. And he will give me content for my blog:</p>
-        <p>
-          "Perhaps the quintessential example of bullshit, bycatch refers to sea creatures caught by accident — except not really "by accident," since bycatch has been consciously built into contemporary fishing methods. Modern fishing tends to involve much technology and few fishers. This combination leads to massive catches with massive amounts of bycatch. Take shrimp, for example. The average shrimptrawling operation throws 80 to 90 percent of the sea animals it captures overboard, dead or dying, as bycatch. (Endangered species amount to much of this bycatch.) Shrimp account for only 2 percent of global seafood by weight, but shrimp trawling accounts for 33 percent of global bycatch. We tend not to think about this because we tend not to know about it. What if there were labeling on our food letting us know how many animals were killed to bring our desired animal to our plate? So, with trawled shrimp from Indonesia, for example, the label might read: 26 pounds of other sea animals were killed and tossed back into the ocean for every 1 pound of this shrimp.
-          Or take tuna. Among the other 145 species regularly killed — gratuitously — while killing tuna are: manta ray, devil ray, spotted skate, bignose shark, copper shark, Galapagos shark, sandbar shark, night shark, sand tiger shark, (great) white shark, hammerhead shark, spurdog fish, Cuban dogfish, bigeye thresher, mako, blue shark, wahoo, sailfish, bonito, king mackerel, Spanish mackerel, longbill spearfi sh, white marlin, swordfish, lancet fish, grey triggerfish, needlefish, pomfret, blue runner,black ruff, dolphin fish, bigeye cigarfish, porcupine fish, rainbow runner, anchovy, grouper, flying fish, cod, common sea horse, Bermuda chub, opah, escolar, leerfish, tripletail, goosefish, monkfish, sunfish, Murray eel, pilotfish, black gemfish, stone bass, bluefish, cassava fish, red drum, greater amberjack, yellowtail, common sea bream, barracuda, puffer fish, loggerhead turtle, green turtle, leatherback turtle, hawksbill turtle, Kemp's ridley turtle, Atlantic yellow-nosed albatross, Audouin's gull, Balearic shearwater, black-browed albatross, great black-backed gull, great shearwater, great-winged petrel, grey petrel, herring gull, laughing gull, northern royal albatross, shy albatross, sooty shearwater, southern fulmar, Yelkouan shearwater, yellow-legged gull, minke whale, sei whale, fin whale, common dolphin, northern right whale, pilot whale, humpback whale, beaked whale, killer whale, harbor porpoise, sperm whale, striped dolphin, Atlantic spotted dolphin, spinner dolphin, bottlenose dolphin, and goose-beaked whale.
-          Imagine being served a plate of sushi. But this plate also holds all of the animals that were killed for your serving of sushi. The plate might have to be five feet across."
-      </p>
+      <% fish = ["Perhaps the quintessential example of bullshit, bycatch refers to sea creatures caught by accident — except not really "'by accident,'" since bycatch has been consciously built into contemporary fishing methods. Modern fishing tends to involve much technology and few fishers. This combination leads to massive catches with massive amounts of bycatch. Take shrimp, for example. The average shrimptrawling operation throws 80 to 90 percent of the sea animals it captures overboard, dead or dying, as bycatch. (Endangered species amount to much of this bycatch.) Shrimp account for only 2 percent of global seafood by weight, but shrimp trawling accounts for 33 percent of global bycatch. We tend not to think about this because we tend not to know about it. What if there were labeling on our food letting us know how many animals were killed to bring our desired animal to our plate? So, with trawled shrimp from Indonesia, for example, the label might read: 26 pounds of other sea animals were killed and tossed back into the ocean for every 1 pound of this shrimp.
+      Or take tuna. Among the other 145 species regularly killed — gratuitously — while killing tuna are: manta ray, devil ray, spotted skate, bignose shark, copper shark, Galapagos shark, sandbar shark, night shark, sand tiger shark, (great) white shark, hammerhead shark, spurdog fish, Cuban dogfish, bigeye thresher, mako, blue shark, wahoo, sailfish, bonito, king mackerel, Spanish mackerel, longbill spearfi sh, white marlin, swordfish, lancet fish, grey triggerfish, needlefish, pomfret, blue runner,black ruff, dolphin fish, bigeye cigarfish, porcupine fish, rainbow runner, anchovy, grouper, flying fish, cod, common sea horse, Bermuda chub, opah, escolar, leerfish, tripletail, goosefish, monkfish, sunfish, Murray eel, pilotfish, black gemfish, stone bass, bluefish, cassava fish, red drum, greater amberjack, yellowtail, common sea bream, barracuda, puffer fish, loggerhead turtle, green turtle, leatherback turtle, hawksbill turtle, Kemp's ridley turtle, Atlantic yellow-nosed albatross, Audouin's gull, Balearic shearwater, black-browed albatross, great black-backed gull, great shearwater, great-winged petrel, grey petrel, herring gull, laughing gull, northern royal albatross, shy albatross, sooty shearwater, southern fulmar, Yelkouan shearwater, yellow-legged gull, minke whale, sei whale, fin whale, common dolphin, northern right whale, pilot whale, humpback whale, beaked whale, killer whale, harbor porpoise, sperm whale, striped dolphin, Atlantic spotted dolphin, spinner dolphin, bottlenose dolphin, and goose-beaked whale.
+      Imagine being served a plate of sushi. But this plate also holds all of the animals that were killed for your serving of sushi. The plate might have to be five feet across.", "Not all chickens have to endure battery cages. In this way only, it could be said that broilers — chickens that become meat (as opposed to layers, chickens that lay eggs) — are lucky: they tend to get close to a single square foot of space.
+      If you aren't a farmer, what I've just written probably confuses you. You probably thought that chickens were chickens. But for the past half century, there have actually been two kinds of chickens — broilers and layers — each with distinct genetics. We call them both chickens, but they have starkly different bodies and metabolisms, engineered for different "'functions.'" Layers make eggs. (Their egg output has more than doubled since the 1930s.) Broilers make flesh. (In the same period, they have been engineered to grow more than twice as large in less than half the time. Chickens once had a life expectancy of fifteen to twenty years, but the modern broiler is typically killed at around six weeks. Their daily growth rate has increased roughly 400 percent.)
+      This raises all kinds of bizarre questions — questions that before I learned about our two types of chickens, I'd never had reason to ask — like, What happens to all of the male offspring of layers? If man hasn't designed them for meat, and nature clearly hasn't designed them to lay eggs, what function do they serve?
+      They serve no function. Which is why all male layers — half of all the layer chickens born in the United States, more than 250 million chicks a year — are destroyed.
+      Destroyed? That seems like a word worth knowing more about.
+      Most male layers are destroyed by being sucked through a series of pipes onto an electrified plate. Other layer chicks are destroyed in other ways, and it's impossible to call those animals more or less fortunate. Some are tossed into large plastic containers. The weak are trampled to the bottom, where they suffocate slowly. The strong suffocate slowly at the top. Others are sent fully conscious through macerators (picture a wood chipper filled with chicks).
+      Cruel? Depends on your definition of cruelty", "Common Farming Exemptions make legal any method of raising farmed animals so long as it is commonly practiced within the industry. In other words, farmers — corporations is the right word — have the power to define cruelty. If the industry adopts a practice — hacking off unwanted appendages with no painkillers, for example, but you can let your imagination run with this — it automatically becomes legal.
+      CFEs are enacted state by state and range from the disturbing to the absurd. Take Nevada. Under its CFE, the state's welfare laws cannot be enforced to "'prohibit or interfere with established methods of animal husbandry, including the raising, handling, feeding, housing, and transporting, of livestock or farm animals.'"
+      What happens in Vegas stays in Vegas. Lawyers David Wolfson and Mariann Sullivan, experts on the issue, explain: Certain states exempt specific practices, rather than all customary farming practices. . . . Ohio exempts farmed animals from requirements for "'wholesome exercise and a change of air,'" and Vermont exempts farmed animals from the section in its criminal anticruelty statute that deems it illegal to "'tie, tether and restrain'" an animal in a manner that is "'inhumane or detrimental to its welfare.'" One cannot help but assume that in Ohio farmed animals are denied exercise and air, and that in Vermont they are tied, tethered or restrained in a manner that is inhumane."] %>
 
-    <footer>
-      <h3>Food: The only reason to get up in the monring</h3>
-      <p>Follow me on <a href="https://twitter.com/BeccaTmac">Twitter,</a>
-         or stalk me on <a href="https://instagram.com/b2ecca2/">Instagram</a></p>
-    </footer>
-  </body>
-</html>
+        <div class ="fish">
+          <p class="blog-post">
+            <%= fish.sample %>
+          </p>
+        </div>
diff --git a/views/index.erb b/views/index.erb
@@ -1,33 +1,9 @@
-<html>
-  <head>
-    <title>Food</title>
-    <meta charset = "utf-8">
-  </head>
-
-  <body>
-    <header>
-      <h3>This is where hungry people hang out.</h3>
-      <ul>
-        <li><a href="/">Homepage</a></li>
-        <li><a href ="projects">Projects</a></li>
-        <li><a href="about">About</a></li>
-        <li><a href="blog">Blog</a></li>
-      </ul>
-    </header>
-      <div>
-        <h1>Welcome to my kitchen</h1>
-        <h2>Bored? Hungry? Grab a knife.</h2>
-      </div>
-          <img src="http://blog.sembrodesigns.com/wp-content/uploads/2015/06/Women-love-a-guy-that-cooks-at-home-kitchen-Columbus-Ohio.jpg" alt="couple laughing and cooking" />
-          <p>
-            I love to eat. So I must cook. I love to buy random vegetables and then figure out what to do with them.
-            Visit my <a href="projects.erb">Projects</a> page to see what I've been making.
-          </p>
-    <footer>
-      <h3>Food: The only reason to get up in the monring</h3>
-      <p>Follow me on <a href="https://twitter.com/BeccaTmac">Twitter,</a>
-         or stalk me on <a href="https://instagram.com/b2ecca2/">Instagram</a></p>
-    </footer>
-  </body>
-
-</html>
+<div id="welcome">
+  <h1>Welcome to my kitchen</h1>
+  <h2>Bored? Hungry? Grab a knife.</h2>
+</div>
+    <img class="kitchen" src="http://blog.sembrodesigns.com/wp-content/uploads/2015/06/Women-love-a-guy-that-cooks-at-home-kitchen-Columbus-Ohio.jpg" alt="couple laughing and cooking" />
+    <p class="tag-line">
+      I love to eat. So I must cook. I love to buy random things and then figure out what to do with them.
+      Visit my <a class="project-nav" href="projects.erb">Projects</a> page to see what I've been making.
+    </p>
diff --git a/views/layout.erb b/views/layout.erb
@@ -0,0 +1,31 @@
+<html>
+  <head>
+    <title>Food Time</title>
+    <meta charset = "utf-8">
+    <link href="/css/style.css" rel="stylesheet">
+  </head>
+
+  <body>
+    <section>
+      <header class="head-foot">
+        <h3>This is where hungry people hang out.</h3>
+        <ul id="navigation">
+          <li><a href="/">Homepage</a></li>
+          <li><a href ="projects">Projects</a></li>
+          <li><a href="about">About</a></li>
+          <li><a href="blog">Blog</a></li>
+        </ul>
+      </header>
+
+      <%= yield %>
+
+      <footer class="head-foot">
+        <h3>Food: The only reason to get up in the morning</h3>
+        <p class="social-footer">Follow me on <a class="social-link" href="https://twitter.com/BeccaTmac">Twitter,</a>
+           or stalk me on <a class="social-link" href="https://instagram.com/b2ecca2/">Instagram</a></p>
+        <h6 class="copyright">copyright <%= @t.year %></h6>
+      </footer>
+    </section>
+  </body>
+
+</html>