generated from Code-Institute-Org/ci-full-template
-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
131 lines (110 loc) · 4.92 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
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
<!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="A Place for Dogs and Their Friends">
<meta name="author" content="Naomi Berhane">
<meta name="keywords" content="bone appétite, dog café">
<link rel="stylesheet" href="assets/css/style.css">
<title>Bone Appétite</title>
</head>
<body>
<header>
<!--Logo Title -->
<a href="index.html" class="remove-underline">
<h1 id="title">Bone Appétite</h1>
</a>
<!--Nav bar content-->
<nav>
<div class="navbar">
<ul class="nav-links">
<li>
<a href="index.html" aria-label="Home" class="active">Home</a>
</li>
<li>
<a href="gallery.html" aria-label="Gallery">Gallery</a>
</li>
<li>
<a href="contact.html" aria-label="Contact">Contact</a>
</li>
</ul>
</div>
</nav>
</header>
<main>
<section>
<h2 class="hero__title">Hero image</h2>
<div id="hero-image">
</div>
</section>
<!--Main Content Home Page-->
<!-- Main Content 1st Row, Parapgraph and Image-->
<section class="dogs-place-1">
<img src="assets/images/dogs-place.jpg" alt="Dog and their friend at the cafe." class="dogs-place-image">
<div class="dogs-place-section">
<h2>A Place for Dogs and Their Friends</h2>
<p> Welcome to Bone Appétite, the ultimate haven for dogs and their friends.
Our warm and inviting café is a place where lasting memories are made.
With spacious play areas for furry friends to mingle and indulge in delicious treats,
while their humans relax and connect, Bone Appétite fosters a sense of community and togetherness.
Join us and experience the joy of canine companionship.
</p>
</div>
</section>
<!-- Main Content 2nd Row, Parapgraph and Image-->
<section class="hangouts">
<img src="assets/images/hangouts-home.jpg" alt="Two running dogs on a path outside." class="hangouts-home-image">
<div class="hangouts-section">
<h2>Hangouts for Dogs and Their Friends</h2>
<p> Discover the perfect dog hangouts at Bone Appétite!
Our events are all about socializing and creating pawsitive connections.
Join us for tail-wagging fun and let your furry friend make new buddies.
From playful playdates to exciting themed gatherings, our dog-centric community awaits!
Experience the joy of togetherness at Bone Appétite.
</p>
</div>
</section>
<!-- Main Content 3rd Row, Parapgraph and Image-->
<section class="food-drinks">
<img src="assets/images/food-and-drinks-image.jpg" alt="Bag of dog treats falling out on surface." class="food-drinks-image">
<div class="food-drinks-section">
<h2>Food & Drinks for Dogs and Their Friends</h2>
<p>Indulge in a delightful culinary experience at Bone Appétite.
Our café offers a delicious selection of foods and drinks for both dogs and their human companions.
Discover a variety of treats, with new doggie specials every month, ensuring a delightful surprise for the dog's taste buds.
Join us and savor the perfect blend of flavors in a welcoming and dog-friendly environment.
</p>
</div>
</section>
</main>
<!--Footer section-->
<footer>
<ul class="social-media">
<li>
<a href="https://instagram.com" target="_blank" rel="noopener" aria-label="Visit our Instagram page">
<i class="fab fa-instagram"></i>
</a>
</li>
<li>
<a href="https://facebook.com" target="_blank" rel="noopener" aria-label="Visit our Facebook page">
<i class="fab fa-facebook-square"></i>
</a>
</li>
<li>
<a href="https://twitter.com" target="_blank" rel="noopener" aria-label="Visit our Twitter page">
<i class="fab fa-twitter-square"></i>
</a>
</li>
<li>
<a href="https://youtube.com" target="_blank" rel="noopener" aria-label="Visit our YouTube channel">
<i class="fab fa-youtube-square"></i>
</a>
</li>
</ul>
</footer>
<!--Script for icons "Font Awesome"-->
<script src="https://kit.fontawesome.com/04566e427e.js" crossorigin="anonymous"></script>
</body>
</html>