-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathbuying.html
194 lines (174 loc) · 10.8 KB
/
buying.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
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Cost Of Living Helper || Buying food</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Nixie+One&family=Parisienne&display=swap" rel="stylesheet">
<link href="styles.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous">
</head>
<body>
<div class="container-fluid text-center">
<!--Banner-->
<div id="banner" class="row">
<div class="col-3"><img class="w-75" src="./images/CoLlogo.png" alt="cost of living logo"/></div>
<div class="col-6"><h1 id="banner-text" class="display-1 mt-5">Buying food</h1></div>
<div class="col-3"><img class="w-75" src="./images/logophone.png" alt="call us logo"/></div>
</div>
<!--Navbar-->
<div class="row">
<nav class="navbar navbar-expand-lg ">
<div class="container-fluid" style="background-color: #dfd8d8">
<!-- <a class="navbar-brand"></a> -->
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item"><a class="nav-link active" aria-current="page" href="index.html">Home</a></li>
<li class="nav-item"><a class="nav-link" href="benefits.html">Benefits</a></li>
<li class="nav-item"><a class="nav-link" href="calculator.html">Calculator</a></li>
<li class="nav-item"><a class="nav-link" href="charities.html">Charities</a></li>
<li class="nav-item"><a class="nav-link" href="clothing.html">Clothing</a></li>
<li class="nav-item"><a class="nav-link" href="education.html">Education</a></li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Food
</a>
<ul class="dropdown-menu" style="background-color: #dfd8d8">
<li><a class="dropdown-item dropdown-style" href="buying.html">Buying food</a></li>
<li><a class="dropdown-item dropdown-style" href="making.html">Making food</a></li>
</ul>
</li>
<li class="nav-item"><a class="nav-link" href="health.html">Health</a></li>
<li class="nav-item"><a class="nav-link" href="kids.html">Kids</a></li>
<li class="nav-item"><a class="nav-link" href="money.html">Make money</a></li>
<li class="nav-item"><a class="nav-link" href="pets.html">Pets</a></li>
<li class="nav-item"><a class="nav-link" href="travel.html">Travel</a></li>
<li class="nav-item"><a class="nav-link" href="utilities.html">Utilities</a></li>
</ul>
<form class="d-flex" role="search">
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success" type="submit">Search</button>
</form>
</div>
</div>
</nav>
</div>
<!--Main body-->
<div class="row pt-5 main-body">
<div class="col-sm-6 col-md-4 main-body">
<div id="foodTipsCarousel" class="carousel slide" data-bs-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active main-body">
<div class="rounded border border-dark p-5 m-2">
<h3>Food Tip 1:</h3>
<p class="fs-5">Don't shop on an empty stomach(you are more likely to buy food you don't need).</p></div>
</div>
<div class="carousel-item main-body">
<div class="rounded border border-dark p-3 m-2">
<h3>Food Tip 2:</h3>
<p class="fs-5">If possible shop online, you will be less tempted to buy things not on your
<br>list, it also enables you to look for money off vouchers</p>
</div>
</div>
<div class="carousel-item main-body">
<div class="rounded border border-dark p-3 m-2">
<h3>Food Tip 3:</h3>
<p class="fs-5">
Supermarkets sometimes have special discounts for certain groups such as icelands 10% off for pensioners when shopping on Tuesday's. Many retailers offer discounts for emergency/nhs workers, students and pensioners.
</p></div>
</div>
<div class="carousel-item main-body">
<div class="rounded border border-dark p-3 m-2">
<h3>Food Tip 4:</h3>
<p class="fs-5">
Don't just go for well known brands, trade secret a lot of the big brand items are made by the same factories that
<br>produce the supermarket own brands. So why not try out the supermarket value range.
</p></div>
</div>
<div class="carousel-item main-body">
<div class="rounded border border-dark p-3 m-2">
<h3>Food Tip 5:</h3>
<p class="fs-5">Meal planning and batch cooking may take some extra time but it can save you
<br>money in the long-run. Take a <br>look at our making food section for some great meal ideas.
</p>
</div>
</div>
<div class="carousel-item main-body">
<div class="rounded border border-dark p-3 m-2">
<h3>Food Tip 6:</h3>
<p class="fs-5">
If you find meal planning too difficult or end up spending on extras when shopping perhaps a meal delivery company would enable you to budget better.
<br>Recommended companies like gousto and hello fresh can save you time on planning/shopping and you know exactly how much your food will cost each month.
</p></div>
</div>
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#foodTipsCarousel" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#foodTipsCarousel" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
</div>
<div class="cols-sm-6 col-md-8 main-body">
<h3 class="main-body display-5">Did you know?...</h3>
<p class="main-body fs-5"> You can price-check your shop with all of the major supermarkets? Always check to see if your shop would be cheaper elsewhere, there are many price checkers but this one is particularly great;
<br><br>
<a class="main-body link-underline-success text-dark fs-4" href="https://www.trolley.co.uk/" target="blank">Trolley price checker</a></p>
<h3 class="main-body display-5"> Sell by/best before dates...</h3>
<p class="main-body fs-5">Food that has almost gone out of date or is just past it's sell by date is still perfectly fine to eat!Remember best before/sell by does not mean you cannot eat it after that date. There are many sites that sell discounted foods with a short shelf life but one of the highest rates is approved foods;
<br><br>
<a class="main-body link-underline-success text-dark fs-4" href="https://www.approvedfood.co.uk/" target="blank">Approved foods</a>
</p>
</div>
</div>
<div class="row mt-3 main-body">
<h3 class="main-body display-5">There are also apps to find reduced food locally</h3>
<div class="card-group main-body w-75 mx-auto mb-3">
<div class="card border-dark m-3" style="width: 16rem;">
<img class="img-fluid" src="./images/olio.png" alt="olio logo"/>
<div class="card-body">
<h5 class="card-title">Olio</h5>
<p class="card-text">Olio is an app for local people to give away things, people often have extra food they want to give away so it's always worth checking</p>
<a class="link-underline-success" href="https://olioapp.com/en/" target="blank"><p class="main-body border border-dark rounded fs-5 w-50 mx-auto quiz-button">Find out more</p></a>
</div>
</div>
<div class="card border-dark m-3" style="width: 16rem;">
<img class="img-fluid" src="./images/toogood.png" alt="olio logo"/>
<div class="card-body">
<h5 class="card-title">Too good to go</h5>
<p class="card-text">Too good to go will show you local shops and restaurants reducing their food at the end of the day, you can usually get an amazing bargain.</p>
<a class="link-underline-success" href="https://www.toogoodtogo.com/en-gb" target="blank"><p class="main-body border border-dark rounded fs-5 w-50 mx-auto quiz-button">Find out more</p></a>
</div>
</div>
</div>
</div>
<!--Footer-->
<div id="footer" class="row pt-2 text-center">
<div class="col-sm-5 col-md-4 float-start">
<p>Registered charity number 897564231</p>
<p>© Copyright Cost Of Living Helper <span id="year"></span></p>
</div>
<div class="col-sm-2 col-md-4">
<img src="./images/facebook.png" class="social-media img-fluid" alt="facebook logo"/>
<img src="./images/twitter.png" class="social-media img-fluid" alt="twitter logo"/>
<img src="./images/instagram.png" class="social-media img-fluid" alt="instagram logo"/>
</div>
<div class="col-sm-5 col-md-4 float-end">
<p>Tel: 01223 344 556</p>
<p>Email: [email protected]</p>
</div>
</div>
</div>
<script src="main.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-Rx+T1VzGupg4BHQYs2gCW9It+akI2MM/mndMCy36UVfodzcJcF0GGLxZIzObiEfa" crossorigin="anonymous"></script>
</body>
</html>