bostonpython-htmlcss-talk/recipe.html at master · frrrances/bostonpython-htmlcss-talk · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
<!DOCTYPE html>
<html lang="en">
<head>

  <meta charset="utf-8" />
  <title>Raspberry Lemonade</title>

  <link rel="stylesheet" href="fancy.css" type="text/css" media="all" />

</head>
<body>
<div id="container">

  <header>
    <h1>Recipe Book</h1>

  </header>

  <section>
    <article class="recipe raspberry-lemonade">
      <figure>
        <img src="raspberry-lemonade.jpg" alt="Raspberry Lemonade" />
        <figcaption>A cool glass of Rasperry Lemonade is perfect for a summer afternoon</figcaption>
      </figure>
      <header>
        <h2 class="title">Raspberry <span class="color-splash">Lemonade</span><a href="#note1">*</a></h2>
      </header>

      <dl class="meta">
        <dt>prep:</dt> <dd>15 mins</dd>
        <dt>total time:</dt> <dd>45 mins</dd>
        <dt>servings:</dt> <dd> 12</dd>
      </dl>

      <section class="ingredients">
        <h3>Ingredients</h3>
        <ul class="ingredients-list">
          <li>10 sliced lemons</li>
          <li>2 cups raspberries</li>
          <li>1 1/2 cups sugar</li>
          <li>6 cups water</li>
          <li>2 1/4 cups tequila blanco (optional)</li>
          <li>Mint, for garnish</li>
        </ul>
      </section>


      <section class="directions">
        <h3>Directions</h3>
        <ol class="directions-list">
          <li>Combine lemons, raspberries, and sugar in a large pot. Pound the mixture firmly with the end of a straight rolling pin (or a large wooden spoon), extracting as much juice as possible, about 10 minutes.</li>
          <li>Stir in water. Pour through a sieve into a large bowl. Press the solids until all juice is extracted. Discard the solids. Serve over ice.</li>
          <li>Cocktail version: Stir tequila into lemonade. Serve over ice, and garnish with mint.</li>
        </ol>
      </section>

      <footer>
        <p>Source: <a href="http://www.marthastewart.com/345019/raspberry-lemonade">Everyday Food, May 2009</a></p>
        <p id="note1" class="note">*with a kick</p>
      </footer>
    </article>
  </section>


  <aside>
    <h2 class="title">Related Recipes</h2>

    <ul class="related-list">
      <li>
        <a href="http://www.nytimes.com/interactive/2012/06/12/dining/summer-drinks-generator.html?ref=dining#/?id=singapore-sling_3-0-0">
          <img src="singapore-sling.jpg" alt="Singapore Sling" />
          Singapore Sling from the <span class="source">New York Times</span>
        </a>
      </li>
      <li>
        <a href="http://www.simplyrecipes.com/recipes/lavender_lemonade/">
          <img src="lavender-lemonade.jpg" alt="Lavender Lemonade" />
          Lavender Lemonade from <span class="source">Simply Recipes</span>
        </a>
      </li>
      <li>
        <a href="http://www.esquire.com/the-side/food-and-drink/summer-cocktails-2013#slide-7">
          <img src="firing-squad.jpg" alt="Sicilian Firing Squad Cocktail" />
          Sicilian Firing Squad from <span class="source">Esquire</span>
        </a>
      </li>
    </ul>
  </aside>
</div>

</body>
</html>