Programming Blog Post 2

<!DOCTYPE html>
<html>
    <head>
        <title>Project: Recipe book</title>
        <meta charset="utf-8">
        <style>
        .recipe{
            color:green;
        }
        #pizzatable{
            color:rgb(255, 0, 0);
        }
        #ramentable{
            color:rgb(250, 192, 20);
        }
        #warning{
            color:rgb(255, 0, 0);
        }
        #sandwich{
            color:pink;
        }
        .step{
            color:darkgrey;
        }
        h1{
            color:violet;
        }
        </style>
    </head>
<body>
This is the second major project assigned by Khan Academy. This definitely took me longer than the last one, but it was a good opportunity to practice the skills I had just learned. I enjoyed this project because it made me feel even more accomplished when I was complete especially after seeing how many lines of code were included. As always you can see the raw HTML and CSS <a href="http://pastebin.com/zJLqjDM3">here</a>.
</body>
    <body id="top">

        <h1>Stefan's Recipe Book</h1>

        <h2>Contents:</h2>

        <ol>
            <li><a href="#pizza">Recipe #1:<strong> Pizza</strong></a></li>
            <li><a href="#recipe2">Recipe #2:<strong> Hearty Ramen Chicken Soup</strong></a></li>
            <li><a href="#recipe3">Recipe #2:<strong> Turkey Sandwich</strong></a></li>
            <li><a href="#learned">What I learned.</a></li>
        </ol>

        <h2 class="recipe" id="pizza">Recipe #1:<strong> Pizza</strong></h2><img src="https://upload.wikimedia.org/wikipedia/commons/f/f2/John's_Inc_Pizzas.jpg" alt="Delicous Looking Pizza" width="300">

        <ul>
            <li>Time: 15 to 20 minutes</li>
            <li>Serves: 1 to 2 people</li>
        </ul>

        <table border="1" id="pizzatable">
            <thead>
                <tr>
                    <th>----------------Ingredients----------------</th>
                    <th>----Quantity----</th>
                </tr>
            </thead>
            <tbody>
            <tr>
                <td>Pizza Dough</td>
                <td>8 ounces</td>
            </tr>
            <tr>
                <td>Tomato Sauce</td>
                <td>1/6th cup</td>
            </tr>
            <tr>
                <td><strong>CHEESE</strong></td>
                <td>1 bag</td>
            </tr>
            <tr>
                <td>Toppings such as meats and veggies.</td>
                <td>As many as needed.</td>
            </tr>
            </tbody>
        </table>
        <h3 class="step"><strong>Steps:</strong></h3>
       <ol>
           <li>Preheat oven to 500-degree F.</li>
           <li>Roll the dough and shape it.</li>
           <li>Apply tomato sauce over the dough.</li>
           <li>Empty bag of cheese over dough, you may want more or less cheese depending on your preference.</li>
           <li>Add whatever toppings suit your fancy.</li>
           <li>Place in oven for approximately 10 minutes.</li>
           <li>Enjoy!</li>
       </ol>

    <p><em>Source: <a target="_blank" href="http://www.foodnetwork.com/how-to/photos/how-to-make-and-form-pizza-dough.html">Food Network Article</a></em></p>


    <!-- END OF RECIPE 1 -->


      <h2 class="recipe" id="recipe2">Recipe #2:<strong> Hearty Ramen Chicken Soup</strong></h2><img src="https://upload.wikimedia.org/wikipedia/commons/1/17/Ramen_bowl_figurines.jpg" alt="Ramen Noodle Bowl" width="300">

        <ul>
            <li>Time: 4 to 8 minutes</li>
            <li>Serves: 1 person</li>
        </ul>

        <table border="1" id="ramentable">
            <thead>
                <tr>
                    <th>----------------Ingredients----------------</th>
                    <th>----Quantity----</th>
                </tr>
            </thead>
            <tbody>
            <tr>
                <td>Sliced carrot</td>
                <td>1 medium</td>
            </tr>
            <tr>
                <td>Sliced celery</td>
                <td>1 rib</td>
            </tr>
            <tr>
                <td>Sliced mushrooms</td>
                <td>1 cup</td>
            </tr>
            <tr>
                <td>Unsalted butter</td>
                <td>2 tbsp.</td>
            </tr>
            <tr>
                <td>Chicken Flavor</td>
                <td>2 packages</td>
            </tr>
            <tr>
                <td>Maruchan Ramen</td>
                <td>1 package</td>
            </tr>
            <tr>
                <td>Water</td>
                <td>4 cups</td>
            </tr>
            <tr>
                <td>Cooked/shredded turkey or chicken</td>
                <td>1/2 cup</td>
            </tr>
            <tr>
                <td>Flour</td>
                <td>2 tbsp.</td>
            </tr>
            <tr>
                <td>Sliced green onions</td>
                <td>2 onions</td>
            </tr>
            <tr>
                <td>Grated parmesan cheese</td>
                <td>4 tbsp.</td>
            </tr>
            <tr>
                <td>Finely chopped parsley</td>
                <td>2 tbsp.</td>
            </tr>
            </tbody>
        </table>

        <h3 class="step"><strong>Steps:</strong></h3>
       <ol>
           <li>Sauté carrots, celery, and mushrooms in unsalted butter until tender</li>
           <li>Add noodles, 3 1/2 cups water, seasoning packets and chicken to vegetables.</li>
           <li>Cook for 3 minutes.</li>
           <li>Combine flour and remaining 1/2 cup cold water.</li>
           <li>Stir into soup.</li>
           <li>Cook and stir until thickened, add green onions.</li>
           <li>Serve immediately, garnish with cheese and parsley.</li>
       </ol>
        <p id="warning"><strong>WARNING: CONTENTS MAY BE HOT WHEN TAKING OFF STOVE!! CONSUME WITH CAUTION!</strong></p>
        <!-- I added this part ;) -->
    <p><em>Source: <a target="_blank" href="http://www.maruchan.com/recipes/hearty-ramen-chicken-soup">Straight off of the Maruchan website.</a></em></p>


    <!-- END OR RECIPE 2 -->


    <h2 class="recipe" id="recipe3">Recipe #3:<strong> Turkey Sandwich</strong></h2><img src="https://upload.wikimedia.org/wikipedia/commons/7/7e/Carnation_Cafe-sandwich01.jpg" alt="Turkey Sandwich" width="300">

        <ul>
            <li>Time: 2 to 4 minutes</li>
            <li>Serves: 1 person</li>
        </ul>

        <table border="1" id="sandwich">
            <thead>
                <tr>
                    <th>----------------Ingredients----------------</th>
                    <th>----Quantity----</th>
                </tr>
            </thead>
            <tbody>
            <tr>
                <td>Bread</td>
                <td>2 slices</td>
            </tr>
            <tr>
                <td>Sliced turkey</td>
                <td>4 to 6 slices</td>
            </tr>
            <tr>
                <td>Mayonaise</td>
                <td>1 knife flick</td>
            </tr>
            <tr>
                <td>Brown mustard</td>
                <td>3 second area covering squrit</td>
            </tr>
            <tr>
                <td>Sliced provolone cheese</td>
                <td>2 to 4 slices</td>
            </tr>
            <tr>
                <td>Chips</td>
                <td>1 person bag</td>
            </tr>
            </tbody>
        </table>
        <h3 class="step"><strong>Steps:</strong></h3>
       <ol>
           <li>Put bread on napkin or plate.</li>
           <li>Apply 1 knife flick of mayo to each slice of bread on one side only.</li>
           <li>Apply brown mustard to both sides.</li>
           <li>Place sliced turkey on one piece of bread.</li>
           <li>Place cheese on other side of bread.</li>
           <li>Combine both pieces of bread and contents to make a delicious sandwich.</li>
           <li> Empty bag of chips onto plate or napkin.</li>
           <li>Enjoy!</li>
       </ol>

    <p><em>Source: <a target="_blank" href="http://lmgtfy.com/?q=How+to+make+a+turkey+sandwich.&l=1">Somewhat Experienced</a></em></p>


    <!-- END OF RECIPE 3 -->


    <h3 id="learned">What I learned:</h3>
    <ul class="step">
    <em>
        <li>How to link stuff.</li>
        <li>How to create tables in HTML.</li>
        <li>How to add comments (see raw HTML).</li>
        <li>How to create tables.</li>
        <li>How to put links to specific areas in the page.</li>
        </em>
    </ul>

    <p><em><a href="#top">Back to top.</a></em></p>
    </body>
</html>