-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
105 lines (96 loc) · 5.76 KB
/
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
93
94
95
96
97
98
99
100
101
102
103
104
105
<!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 || Home</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/bootstrap@5.3.1/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-sm-1 col-md-2"></div>
<div class="col-sm-10 col-md-7"><img class="w-50 img-fluid" src="./images/CoLlogo.png" alt="cost of living logo"/></div>
<div class="col-sm-1 col-md-3"><img class="w-75 img-fluid" 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" onClick="searchFunction()">Search</button>
</form>
</div>
</div>
</nav>
</div>
<!--Main body-->
<div class="row pt-5 main-body">
<div class="col-sm-6 col-md-8 main-body">
<h2 class="main-body display-4">Welcome</h2>
<p class="main-body fs-4">Our goal is to provide support to whoever is in need of it during these difficult
times. We understand how the cost of living crisis has affected everyone
and we hope we can give you ways to try to overcome this issue or to even just give a little
bit of support with any problems surrounding the crisis.</p>
<p class="main-body fs-4 pt-4">You will find a number of different sections on this site to help you with
the everyday cost of living.
</p>
</div>
<div class="cols-sm-6 col-md-4 main-body"><img class="w-75" src="./images/handclasp.png" alt="hands clasping in house frame"/></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: help@colhelper.com</p>
</div>
</div>
</div>
<script src="main.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js" integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/js/bootstrap.min.js" integrity="sha384-Rx+T1VzGupg4BHQYs2gCW9It+akI2MM/mndMCy36UVfodzcJcF0GGLxZIzObiEfa" crossorigin="anonymous"></script>
</body>
</html>