generated from Code-Institute-Org/gitpod-full-template
-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathrecipe-spag-bol.html
135 lines (125 loc) · 6.32 KB
/
recipe-spag-bol.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
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Love 2 Cook - Cooking Recipes that won't break the bank">
<meta name="keywords" content="cooking, beginner, recipes, budget">
<link rel="stylesheet" href="assets/css/style.css">
<link rel="icon" href="assets/img/frying-pan-icon.png">
<title>Love 2 Cook</title>
</head>
<body>
<header>
<a href="index.html">
<h1 id="logo" >
<img id="icon" src="assets/img/frying-pan-icon.png" alt="Frying Pan Icon">Love 2 Cook
</h1>
</a>
<nav>
<div id="header-menu">
<ul id="menu">
<li>
<a href="index.html">Home</a>
</li>
<li>
<a href="recipes-main.html" >Recipes</a>
</li>
<li>
<a href="contact.html">Contact</a>
</li>
</ul>
</div>
</nav>
</header>
<section class="recipe-outer">
<div class="recipe-card">
<div class="recipe-image">
<img src="assets/img/spag-bol-504x504.jpg" alt="Spaghetti bolognese image">
</div>
<div class="method-ingredients">
<div class="recipe-card-heading">
<h2>
Spaghetti Bolognese
</h2>
</div>
<div class="prep-cook">
<h3><i class="fas fa-mortar-pestle"></i> Prep Time: 20 mins </h3>
<h3><i class="fab fa-gripfire"></i> Cook Time: 1 hr 20min </h3>
<h3><i class="fas fa-clock"></i> Total Time: 1hr 40min </h3>
</div>
<div class="recipe-ingredients">
<div class="ingredients-heading">
<h3>Ingredients</h3>
</div>
<div class="ingredients-list">
<ul>
<li>1 tbsp / 15ml olive oil</li>
<li>4 smoked streaky bacon rashers, finely chopped</li>
<li>1 large onion, finely chopped</li>
<li>2 large carrots, finely chopped</li>
<li>3 stalks of celery, finely chopped</li>
<li>2 garlic cloves, finely chopped / minced</li>
<li>3 sprigs of rosemary / 2 tsp dried rosemary</li>
<li>500g mined beef</li>
<li>2 tins plum tomatoes</li>
<li>1 beef stock cube</li>
<li>1/2 pack of fresh basil, finely chopped </li>
<li>1 tsp dried oregano</li>
<li>2 frsh/dried bay leaves</li>
<li>2 tbsp tomato puree</li>
<li>125ml red wine (optional, but recommended)</li>
<li>parmesan to serve</li>
<li>500g spaghetti</li>
<li>crusy bread / garlic bread (optional)</li>
</ul>
</div>
</div>
<div class="recipe-method">
<div class="method-heading">
<h3>Method</h3>
</div>
<div class ="method-list">
<ol>
<li>Put a large saucepan on a medium heat and add your olive oil.</li>
<li>Add the finely chopped rashers and fry for 10 mins until golden and crisp.</li>
<li>Reduce the heat slightly and add the onions, celery and carrots, garlic cloves and the leaves from 2-3 sprigs rosemary, then fry for 10 mins until veg softens.</li>
<li>Increase the heat to medium-high, add minced beef and cook stirring for about 5 mins until the meat is browned all over.</li>
<li>Add the tins of plum tomatoes, the finely chopped basil leaves, dried oregano, bay leaves, tomato purée, beef stock cube and 125ml red wine. Stir with a wooden spoon, breaking up the plum tomatoes.</li>
<li>Bring this to the boil, reduce to a simmer and cover with a lid. Cook for 50 mins stirring occasionally, until sauce becomes rich and thick.</li>
<li>When the bolognese is nearly done, cook your spaghetti following the pack instructions.</li>
<li>Drain the spaghetti and either stir into the bolognese sauce, or serve the sauce on top. Serve with grated parmesan on top, the remaining basil leaves and garlic bread, if you like.</li>
<li>Enjoy!</li>
</ol>
</div>
</div>
</div>
</div>
</section>
<footer>
<h2 class="socials-note">Find us on our Social Accounts</h2>
<hr class="hr-thick">
<ul class="socials">
<li>
<a href="https://facebook.com" target="_blank" rel="noopener"
aria-label="Visit our Facebook page (opens in a new tab)"><i class="fab fa-facebook-f"></i></a>
</li>
<li>
<a href="https://twitter.com" target="_blank" rel="noopener"
aria-label="Visit our Twitter page (opens in a new tab)"><i class="fab fa-twitter"></i></a>
</li>
<li>
<a href="https://youtube.com" target="_blank" rel="noopener"
aria-label="Visit our Youtube page (opens in a new tab)"><i class="fab fa-youtube"></i></a>
</li>
<li>
<a href="https://instagram.com" target="_blank" rel="noopener"
aria-label="Visit our Facebook page (opens in a new tab)"><i class="fab fa-instagram"></i></a>
</li>
</ul>
</footer>
<!-- font awesome script -->
<script src="https://kit.fontawesome.com/0dd576827f.js" crossorigin="anonymous"></script>
</body>
</html>