Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<!--HTML5 doctype-->
<html lang="en">
​
<head>
    <meta charset="UTF-8">
    <title>Recipe project - Module 5</title>
</head>
​
<body>
  
<!--Our global header-->
    <header>
        <h1>My Favorite (Vegan) Recipes</h1>
        
<!--    Navigation can be on its own or within the header element-->
        <nav>
            <ol>
                <li><a href="#PBcookies">Peanut Butter Cookies</a></li>          
                <li><a href="#TartarSauce">Tartar Sauce</a></li>
                <li><a href="#ThousandIsland">Thousand Island Dressing</a></li>
                <li><a href="#HotMustard">Hot Mustard</a></li>
                <li><a href="#BBQSauce">BBQ Sauce</a></li>              
                <li><a href="#OreoPosicle">Oreo Popsicle</a></li>
                <li><a href="#ThaiPeanut">Thai Peanut</a></li>
                <li><a href="#OrangeSoda">Orange Soda</a></li>              
          </ol>
        </nav>
    </header>
​
<!--The main content of our page starts here-->
    <main>
                
<!--    Our Recipes section-->
        <section>
​
          <hr>
          
<!--      Our Peanut Butter Cookies article-->
​
            <article>
          
             <header id="PBcookies">
               <h2>Peanut Butter Cookies</h2>
             </header>
​
              <img src='http://upload.wikimedia.org/wikipedia/commons/2/24/Peanut_butter_cookies%2C_September_2009.jpg' alt="A public-domain image of peanut butter cookies." title="By Janet Hudson [CC BY 2.0 (http://creativecommons.org/licenses/by/2.0)], via Wikimedia Commons" width=256px>              
​
<!--      Module 5 Revision replaces a list with a table...
​
               <p><h3>Ingredients Required</h3></p>
                 <ul>
                   <li>(1 cup) Peanut Butter - chunky/smooth/etc.</li>
                   <li>(1 cup) Sugar - perhaps less if using raw</li>
                   <li>(1) Egg - binding equivalent</li>
                 </ul>
-->
​
              <p><h3>Ingredients Required</h3></p>
                <table>
                  <tr>
                    <th>Ingredient</th>
                    <th>Quantity</th>
                  </tr>
                  <tr>
                    <td>Peanut Butter - chunky/smooth/etc.</td>
                    <td>1 Cup</td>
                  </tr>
                  <tr>
                    <td>Sugar</td>
                    <td>1 Cup (perhaps less if using raw)</td>
                  </tr>
                  <tr>
                    <td>Egg</td>
                    <td>1 (or binding equivalent)</td>
                  </tr>
                </table>
              
               <p>Suggested Procedure</p>
                 <ol>
                   <li>Mix ingredients until undifferentiated.</li>
                   <li>Scoop tablespoons onto a parchment-lined baking sheet; space evenly.</li>
                   <li>Bake at 350 degrees for ~6 minutes & cool on a wire rack.</li>
                 </ol>
​
            </article>
          
          <hr>
            
<!--      Our Tartar Sauce article-->
​
            <article>
          
              <header id="TartarSauce">
                <h2>Tartar Sauce</h2>
              </header>
            
                <p><h3>Ingredients Required</h3></p>
                  <ul>
                    <li>(3 packets/1 cup) Mayonnaise, e.g. Just Mayo</li>
                    <li>(2 tbsp) Relish</li>
                    <li>(1 tsp) Mustard</li>
                  </ul>
                <p>Suggested Procedure</p>
                  <ol>
                    <li>Mix ingredients until undifferentiated.</li>
                    <li>Season to taste (e.g. adding dill, lemon, etc.)</li>
                    <li>Store, refrigerated - but consume expediently.</li>
                  </ol>
​
            </article>
                  
          <hr>
​
<!--      Our Thousand Island Dressing article-->
​
            <article>
          
              <header id="ThousandIsland">
                <h2>Thousand Island Dressing</h2>
              </header>
            
                <p><h3>Ingredients Required</h3></p>
                  <ul>
                   <li>(1 unit) Mayonnaise, e.g. Just Mayo</li>
                   <li>(1 unit) Relish</li>
                   <li>(1/2 unit) Ketchup</li>
                  </ul>
                <p>Suggested Procedure</p>
                  <ol>
                    <li>Mix ingredients until undifferentiated.</li>
                    <li>Taste to confirm desired proportions.</li>
                    <li>Store?  Refrigerated - but consume expediently.</li>
                  </ol>
                
            </article>
​
          <hr>              
​
<!--      Our Hot Mustard Article-->
​
            <article>
          
              <header id="HotMustard">
                <h2>Hot Mustard</h2>
              </header>
            
                <p><h3>Ingredients Required</h3></p>
                  <ul>
                   <li>(6 unit) Regular Yellow Mustard (not French's)</li>
                   <li>(2 unit) Dry (ground) Mustard</li>                    
                   <li>(2 unit) Mayonnaise, e.g. Just Mayo</li>
                   <li>(1 unit) Vinegar</li>
                   <li>(1/2 unit) Sugar</li>
                   <li>(1/2 unit) Soy Sauce
                   <li>Cayenne Pepper (e.g. Louisianna 'One Drop')</li>
                  </ul>
                <p>Suggested Procedure</p>
                  <ol>
                    <li>Mix ingredients until undifferentiated.</li>
                    <li>Taste to confirm desired proportions (compare to standard, e.g. Panda...?)</li>
                    <li>Share! (If needed, store, refrigerated - but consume expediently.)</li>
                  </ol>
                
            </article>
​
          <hr>      
​
<!--      Our Bar-B-Q Sauce Article-->
​
            <article>
          
              <header id="BBQSauce">
                <h2>Bar-B-Que (BBQ) Sauce</h2>
              </header>
            
                <p><h3>Ingredients Required</h3></p>
                  <ul>
                   <li>(12 unit) Ketchup</li>
                   <li>(2 unit) Dry (ground) Mustard</li>                    
                   <li>(2 unit) Brown Sugar</li>
                  </ul>
                <p>Suggested Procedure</p>
                  <ol>
                    <li>Mix ingredients until undifferentiated.</li>
                    <li>Taste to confirm desired proportions, i.e. sweetness.</li>
                    <li>Store - as desired - refrigerated... but consume expediently.</li>
                  </ol>
                
            </article>
​
          <hr>      
​
<!--      Our Oreo Popsicle Article-->
​
            <article>
          
              <header id="OreoPopsicle">
                <h2>Oreo Popsicle</h2>
              </header>
            
                <p><h3>Ingredients Required</h3></p>
                  <ul>
                   <li>(1 Cup) Coconut Cream</li>
                   <li>(2 Cups) Oreo Cookies
                   <li>(3+ Packets) Sugar</li>
                  </ul>
                <p>Suggested Procedure</p>
                  <ol>
                    <li>Mix ingredients until undifferentiated.</li>
                    <li>Taste to confirm desired proportions (add sugar v/s cookies...?)</li>
                    <li>Freeze until solid.</li>
                  </ol>
                
            </article>
​
          <hr>   
​
<!--      Our Thai Peanut Article-->
​
            <article>
          
              <header id="ThaiPeanut">
                <h2>Thai Peanut</h2>
              </header>
            
                <p><h3>Ingredients Required</h3></p>
                  <ul>
                   <li>(1 Packet) Soy Sauce</li>
                   <li>(1 Packet) Chili Paste</li>
                   <li>(1 Packet) Vinegar</li>
                   <li>(1 Packet) Peanut Butter</li>                    
                   </ul>
                <p>Suggested Procedure</p>
                  <ol>
                    <li>Mix ingredients until undifferentiated.</li>
                    <li>Taste to confirm desired proportions (Yondu required?)</li>
                    <li>Scale accordingly...</li>
                  </ol>
                
            </article>
​
          <hr>   
​
<!--      Our Orange Soda Article-->
​
            <article>
          
              <header id="OrangeSoda">
                <h2>Orange Soda</h2>
              </header>
            
                <p><h3>Ingredients Required</h3></p>
                  <ul>
                   <li>(1 Unit) Fresh Orange's Juice</li>
                   <li>(1 Unit) Sugar</li>
                   <li>(1 Unit) Water</li>
                   </ul>
                <p>Suggested Procedure</p>
                  <ol>
                    <li>Mix ingredients until undifferentiated.</li>
                    <li>Add heat to concentrate as a syrup; cool with a base to dilute.</li>
                    <li>Carbonate for maximal enjoyment.</li>
                  </ol>
                
            </article>
​
          <hr>   
​
        </section>
  
  </main>
  
</body>
​
</html>
 
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
idfubarpro
0viewers