repl.it
@songa17/

Final Project of 5 Day Challenge With Code Institute

HTML, CSS, JS

No description

fork
loading
Files
  • index.html
  • index.css
  • index.js
index.html
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
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
<title>How To Make Tiramisu</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css"/>
<link href="index.css" rel="stylesheet" type="text/css"/>
  </head>
  <body>
    <div id="container">
     <header>
        <h1>How To Make Tiramisu</h1>
        <img src = "https://upload.wikimedia.org/wikipedia/commons/thumb/a/a5/Tiramisu-romanian.jpg/800px-Tiramisu-romanian.jpg" 
        alt="Tiramisu">
    <p>From the Italian language Tiramisu means "pick me up" or "cheer me up". This fantastically delious dessert keeps its promises and will never let you down! Fly!</p>
    </header>
    <ul>
      <li>Time: 25mins + chilling</li>
      <li>Serves: 6-8</li>
    </ul>
        <section id="ingredients" onmouseover="ingredientsHover()" onmouseout="ingredientsNormal()">
<h2>Ingredients <i class="fa fa-book" aria-hidden="true"></i></h2>
        <table>
            <thead>
                <tr>
                  <th>Ingredients</th>
                  <th>Quantity</th>
                </tr>
            </thead>
            <tr>
              <td>double cream</td>
              <td>568ml</td>
            </tr>
            <tr>
              <tr>
              <td>mascarpone</td>
              <td>250g</td>
            </tr>
            <tr>
                <td>marsala</td>
                <td>75ml</td>
            </tr>
            <tr>
              <td>golden caster sugar</td>
              <td>5 tbsp</td>
            </tr>
            <tr>
           <td>strong coffee</td>
                <td>300ml</td>
            </tr>
            <tr>
       <td>sponge finger</td>
                <td>175g</td>
            </tr>
            <tr>
                <td>dark chocolate</td>
                <td>25g</td>
            </tr>
            <tr>
                <td>cocoa powder</td>
                <td>2 tsp</td>
            </tr>
            <tbody>
            </tbody>
        </table>
   </section>
        <section id="preparation" onmouseover="preparationHover()" onmouseout="preparationNormal()">
          <h2>Preparation <i class="fa fa-check-circle-o" aria-hidden="true"></i></h2>
        <p><strong>Step 1:</strong> Put a 568ml pot double cream, 250g tub mascarpone, 75ml marsala and 5 tbsp golden caster sugar in a large bowl.
        </p>
        <p><strong>Step 2:</strong> Whisk until the cream and mascarpone have completely combined and have the consistency of thickly whipped cream.
        </p>    
        <p><strong>Step 3:</strong> Pour 300ml strong coffee (made with 2 tbsp coffee granules and 300ml boiling water) into a shallow dish.
        </p>
        <p><strong>Step 4:</strong> Dip in a few of the 175g pack of sponge fingers at a time, turning for a few secs until they are nicely soaked, but not soggy. Layer these into your dish until you have used half the sponge fingers, then spread over half of the creamy mixture.
        </p>
        <p><strong>Step 5:</strong> Using the coarse side of the grater, grate over most of the 25g dark chocolate. Then repeat the layers (you should use up all the coffee), finishing with the creamy layer.
        </p>
        <p><strong>Step 6:</strong> Cover and chill for a few hours or overnight. This can now be kept in the fridge for up to 2 days. 
        </p>
        <p><strong>Step 7:</strong> To serve, dust with 2 tsp cocoa powder and grate over the remainder of the chocolate.
      </section>
      <hr>
       <p>Source: <a href="https://www.bbcgoodfood.com/recipes/9652/bestever-tiramisu">BBS goodfood</a></p>
    <footer>
      <p>Copyright Me 2019</p>
    </footer>
    </div>
    <script src="index.js"></script>
  </body>
</html>
result
console