forked from CodeYourFuture/HTML-CSS-Coursework-Week3
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
89 lines (78 loc) · 3.7 KB
/
index.html
File metadata and controls
89 lines (78 loc) · 3.7 KB
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Bluebird Bakehouse</title>
<!-- Add a link to your css file here -->
<link rel="stylesheet" href="css/style.css" />
</head>
<body>
<!-- Add your markup here -->
<header class="header">
<img class="header__logo" src="./images/Bluebirdlogo.png" alt="company_logo" />
<p class="header__text">Creating wonderful bespoke cakes for your special occasions</p>
<ul class="navbar">
<li><a class="navbar__link" href="#">Home</a></li>
<li><a class="navbar__link" href="#">About</a></li>
<li><a class="navbar__link" href="#">Gallery</a></li>
<li><a class="navbar__link" href="#">Information</a></li>
<li><a class="navbar__link" href="#">Contact us</a></li>
</ul>
</header>
<main class="main">
<div class="main__content">
<h1 class="main__title">Welcome to the Bluebird Bakehouse</h1>
<p class="main__text">
Whether you want a simple, luxury, novelty or fanciful Wedding Cake we will work with you every step of the way to create the perfect centrepiece for your special day.
Weddings are very special and personal occasions, many people have very specific ideas about what they want but arranging and organising everything can be difficult and stressful.
We have been making Wedding Cakes for years now and we always try to use our knowledge and experience to make planning and ordering your cake an exciting and stress free experience. Once you have ordered your cake from us we will deliver and set up your cake on the day to ensure everything is perfect for when you and your guests arrive at your chosen venue.
</p>
</div>
<img
class="central_image"
src="./images/cake backdrop.png"
alt="cake display"
/>
<section class="cake_gallery_container">
<div
class="gallery_cake"
style= "background-image: url(./images/FlowerCake.jpeg)"
role="image"
aria-label="strawberry-cake"
title="strawberry-cake"
></div>
<div
class="gallery_cake"
style="background-image: url(./images/GeoCake.jpg)"
role="image"
aria-label="FlowerCake"
title="FlowerCake"
></div>
<div
class="gallery_cake"
style="background-image: url(./images/FlowersCake.jpg)"
role="image"
aria-label="GeoCake"
title="GeoCake"
></div>
<div
class="gallery_cake"
style="background-image: url(./images/WoodCake.jpg)"
role="image"
aria-label="FlowersCake"
title="FlowersCake"
></div>
</section>
</main>
<footer class="footer">
<div class="footer_socials">
<a href="#"><i class="fa-brands fa-facebook"></i>Facebook</a>
<a href="#"><i class="fa-brands fa-instagram"></i>Instagram</a>
<a href="#"><i class="fa-brands fa-pinterest"></i>Pinterest</a>
</div>
<p class="footer_copyright">© Bluebird Bakehouse</p>
</footer>
</body>
</html>