Images

Recipes/Ajitama Eggs.md

@@ -2,6 +2,7 @@
 description: Tasty salty/sweet marinated eggs. Good by themselves, or sliced in half and served as a ramen topping.
 tags: healthy, friday-friendly
 ingredients: eggs
+hero_image: ajitama_egg.jpg
 ---
 
 # Ajitama Eggs

Recipes/Simple Tomato Sauce.md

@@ -2,6 +2,7 @@
 description: Simple and quick tomato sauce, the way my nonna taught me.
 tags: italian, monacilioni, friday-friendly
 ingredients: tomatoes, basil
+hero_image: sauce.jpg
 ---
 
 # Simple Tomato Sauce, Monacilioni Style

Recipes/Southwest Black Beans.md

@@ -4,7 +4,7 @@ tags: friday-friendly, weeknight
 ingredients: beans
 ---
 
-# "Mexican" Black Beans
+# Southwest Black Beans
 
 This is tasty, easy, quick, and optionally meatless. The heavy lifting is done by the Goya Sazon. Really brainless and easy and tasty.
 

Recipes/cocktails/Apple Sangria.md

@@ -2,6 +2,7 @@
 description: A sweet, appley, fall cocktail 
 tags: cocktails
 ingredients: vodka, wine
+hero_image: apple_sangria.jpg
 ---
 
 # Apple "Sangria"

Recipes/cocktails/Mojito.md

@@ -2,6 +2,7 @@
 description: My personal takes on a classic mojito. 
 tags: cocktails
 ingredients: rum, lime, mint
+hero_image: mojito.jpg
 ---
 
 # Mojito

Recipes/cocktails/Sangria.md

@@ -2,6 +2,7 @@
 description: Red sangria typical of what you'd find at a Spanish/Portuguese/Brazillain restaurtant in New Jersey.
 tags: cocktails
 ingredients: wine, brandy
+hero_image: sangria.jpg
 ---
 
 # Sangria 

Recipes/mobile/index.html

@@ -12,15 +12,16 @@
 
   .recipe-link {
     display: block;
+    position: relative;
     border: 2px solid #3d5a80;
-    padding: 5.4em .7em .4em .7em;
     background-color: #98c1d9;
     background-size: cover;
-    background-position: top;
+    background-position: center;
     color: #fff;
     border-radius: 5px;
     text-shadow: 0px 0px 1px rgba(41,50,65,0.3);
     flex-grow: 1;
+    height: 10em;
   }
   .recipe-link:hover {
     color: #ee6c4d;
@@ -29,6 +30,16 @@
   .recipe-link[data-hide=true] {
     display: none;
   }
+
+  .recipe-link > .text {
+    position: absolute;
+    background-color: rgba(32,32,32,0.5);
+    bottom: 0;
+    left: 0;
+    right: 0;
+    padding: 1em;
+  }
+
   .recipe-link strong {
     font-size: 130%;
     line-height: 1.2em;
@@ -153,17 +164,19 @@ <h1>Recipe Search</h1>
         {%- endif -%}
 
   <a class="recipe-link tag-{{ tags | join: ' tag-' }} ingredient-{{ ingredients | join: ' ingredient-' }}" href="{{ page.url | relative_url }}" {{ recipe_style }}>
-    <strong>{{page.title}}</strong>
-    <ul class="tags">
-      {% for tag in tags %}
-      <li>{{tag}}</li>
-      {% endfor -%}
-    </ul>
-    <ul class="key-ingredients">
-      {% for ingredient in ingredients %}
-      <li>{{ingredient}}</li>
-      {% endfor -%}
-    </ul>
+    <div class="text">
+      <strong>{{page.title}}</strong>
+      <ul class="tags">
+        {% for tag in tags %}
+        <li>{{tag}}</li>
+        {% endfor -%}
+      </ul>
+      <ul class="key-ingredients">
+        {% for ingredient in ingredients %}
+        <li>{{ingredient}}</li>
+        {% endfor -%}
+      </ul>
+    </div>
   </a>
       {%- endif -%}
     {%- endif -%}