forked from zero-to-mastery/Halloween-Hacktoberfest-Edition
-
Notifications
You must be signed in to change notification settings - Fork 0
/
recipes.html
149 lines (140 loc) · 5.23 KB
/
recipes.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
136
137
138
139
140
141
142
143
144
145
146
147
148
149
<!doctype html>
<html lang="en">
<head id="head">
<!-- Head information is dynamically loaded -->
<!-- If you need to include a different stylesheet do so below -->
<script src="./js/cssLoad.js"></script> <!-- Dynamically Imports css -->
<!-- some styling -->
<link href="./css/recipes.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="./css/fog.css" />
</head>
<body class="recipes">
<div id="myNav">
<!-- NavBar is dynamically loaded -->
<!-- If you need to include links check out ./js/headFoot.js -->
</div>
<div id='fog-roll'>
<img src="https://media.giphy.com/media/xEjTM5COAKyNa/giphy-downsized.gif" />
</div>
<main role="main" class="main top-margin">
<h1 class="tc heading ">Recipes</h1>
<!-- recipe card 1-->
<article class="center container card">
<div class="row card-body">
<div class="col">
<img src="./images/marshmallowspiders.PNG" class="img-thumbnail">
</div>
<div class="col-lg">
<h1>Marshmallow Spiders</h1>
<h2>
<ul>
<li>6 Marshmallows</li>
<li>48 Pretzel sticks</li>
<li>1 c. white chocolate, melted</li>
<li>1 tsp. coconut oil</li>
<li>18 Candy eyes</li>
<li>Hot chocolate, for serving</li>
</ul>
<a href="https://www.delish.com/cooking/recipe-ideas/recipes/a55856/halloweentown-marshmallow-spiders-recipe/">
More info...</a>
</h2>
</div>
</div>
</article>
<br>
<!-- recipe card 2-->
<article class="center container card ">
<div class="row card-body">
<div class="col">
<img src="./images/recipe1.JPG" class="img-thumbnail">
</div>
<div class="col-lg">
<h1>Spooky Eyeball Tacos</h1>
<h2>
<ul>
<li>1 lb ground beef</li>
<li>1 (1 1/4 ounce) package taco seasoning mix</li>
<li>12 taco shells</li>
<li>3⁄4 cup salsa</li>
<li>3⁄4 cup sour cream</li>
<li>1 tomatoes, small cubes</li>
<li>1 small head lettuce, sliced into small confetti squares</li>
<li>1 (2 1/4 ounce) canlarge black olives, sliced</li>
<li>1 cup cheese, Shredded & Long </li>
</ul>
<a href="https://www.justapinch.com/recipes/appetizer/other-appetizer/mexican-spooky-eyeball-tacos.html">
More info...</a>
</h2>
</div>
</div>
</article>
<br>
<!-- recipe card 3-->
<article class="center container card">
<div class="row card-body">
<div class="col">
<img src="https://polki.pl/foto/4_3_LARGE/palce-wiedzmy-na-halloween-313165.jpg" class="img-thumbnail">
</div>
<div class="col-lg">
<h1>Witches' fingers</h1>
<h2>
<ul>
<li>1 cup butter, softened</li>
<li>1 cup confectioners' sugar</li>
<li>1 egg</li>
<li>1 tsp almond extract</li>
<li>1 tsp vanilla extract</li>
<li>2 2/3 cups all-purpose flour</li>
<li>1 tsp baking powder</li>
<li>1 tsp salt</li>
<li>3/4 cup whole almonds</li>
<li>1(.75 oz) tube red decorating gel</li>
</ul>
<a href="https://www.allrecipes.com/recipe/146819/spooky-witches-fingers/">More info...</a>
</h2>
</div>
</div>
</article>
<br>
<!-- recipe card 4 -->
<article class="center container card">
<div class="row card-body">
<div class="col">
<img src="https://hips.hearstapps.com/del.h-cdn.co/assets/16/38/1474660786-delish-pizza-bagels.jpg?crop=1.0xw:1xh;center,top&resize=*:2001" class="img-thumbnail img-resize">
</div>
<div class="col-lg">
<h1>Ghost Pizza Bagel</h1>
<h2>
<ul>
<li>8 slices of mozzarella</li>
<li>8 mini bagels</li>
<li>1/2 c. marinara</li>
<li>4 black olives</li>
</ul>
<a href="https://www.delish.com/holiday-recipes/halloween/recipes/a49353/ghost-pizza-bagels-recipe/">More info...</a>
</h2>
</div>
</div>
</article>
<br>
<div class="wrapper">
<a class="btn btn-lg btn-primary" href="https://bit.ly/2C1mQBZ" role="button">More Recipes...</a>
</div>
<br>
</main>
<div id="myFoot">
<!-- Footer is dynamically loaded -->
<!-- If you need to include links check out ./js/headFoot.js -->
</div>
<div id="endScripts">
<!-- Global script files are imported from ./js/headFoot.js -->
<!-- Add page specific link below this line -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
crossorigin="anonymous"></script>
</div>
<!-- Loads Nav & Footer - IMPORTANT -->
<script src="./js/headFoot.js"></script>
</body>
</html>