generated from Code-Institute-Org/gitpod-full-template
-
Notifications
You must be signed in to change notification settings - Fork 1
/
food-menu.html
141 lines (141 loc) · 8.2 KB
/
food-menu.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
<!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="Authentic Italian Pizzeria only using fresh ingredients based in Borrisokane.">
<meta name="keywords" content="pizza, fresh, italian, food, borrisokane">
<meta name="author" content="Tomas_K_5P">
<link rel="stylesheet" href="assets/css/styles.css">
<link rel="icon" type="image/x-icon" href="assets/images/icon.png">
<title>Cibo Fresco | Food Menu</title>
</head>
<body>
<header> <!-- Set header -->
<div class="header-footer"> <!-- Header outer container -->
<a href="index.html"> <!-- Logo -->
<h1 id="logo">
<i class="fa-solid fa-pizza-slice"></i>
Cibo Fresco
</h1>
</a>
<nav id="hamburger-menu"> <!-- Hamburger menu - only relevant at width less 1140px -->
<label for="hamburger">☰</label>
<input type="checkbox" id="hamburger">
<div id="menu"> <!-- Menu -->
<a href="reserve.html">Reserve a Table!</a>
<a href="index.html">Home</a>
<a href="food-menu.html" class="active-page">Food Menu</a>
<a href="drink-menu.html">Drink Menu</a>
<a href="gallery.html">Gallery</a>
<a href="contact.html">Contact</a>
</div>
</nav>
</div>
</header>
<main id="food-content-outer"> <!-- Outer food page container -->
<div class="food-selection float-right"> <!-- Apetizers container -->
<div class="food-heading">
<div id="apetizer" class="food-menu-item-image"> <!-- Apitezers image -->
</div>
</div>
<div class="food-details"> <!-- Apetizer heading & list -->
<h2>Apetizers :</h2>
<ul>
<li><strong>Bruschetta:</strong>toasted bread with tomatoes, garlic, and basil <span class="food-price">€6.95</span></li>
<li><strong>Arancini:</strong>fried rice balls stuffed with mozzarella and ground beef <span class="food-price">€7.95</span></li>
<li><strong>Carpaccio di Manzo:</strong>slices of raw beef with arugula, parmesan, and lemon dressing <span class="food-price">€9.95</span></li>
<li><strong>Prosciutto e Melone:</strong>slices of cured ham with fresh melon <span class="food-price">€6.95</span></li>
</ul>
</div>
</div>
<div class="food-selection float-left"> <!-- Pizza container -->
<div class="food-heading">
<div id="pizza" class="food-menu-item-image"> <!-- Pizza image -->
</div>
</div>
<div class="food-details"> <!-- Pizza heading & list -->
<h2>Pizza :</h2>
<ul>
<li><strong>Margherita:</strong>tomato sauce, fresh mozzarella cheese, fresh basil <span class="food-price">€19.95</span></li>
<li><strong>Quattro Formaggi:</strong>mozzarella, gorgonzola, parmesan, and fontina <span class="food-price">€19.95</span></li>
<li><strong>Diavola:</strong>tomato sauce, spicy salami, mozzarella, fresh basil <span class="food-price">€19.95</span></li>
<li><strong>Funghi:</strong>tomato sauce, mushrooms, mozzarella, fresh thyme <span class="food-price">€19.95</span></li>
</ul>
</div>
</div>
<div class="food-selection float-right"> <!-- Pasta container -->
<div class="food-heading">
<div id="pasta" class="food-menu-item-image"> <!-- Pasta image -->
</div>
</div>
<div class="food-details"> <!-- Pasta heading & list -->
<h2>Pasta :</h2>
<ul>
<li><strong>Spaghetti Carbonara:</strong>spaghetti in a creamy sauce with pancetta, parmesan, and pepper <span class="food-price">€17.95</span></li>
<li><strong>Lasagna:</strong>layers of pasta, bolognese sauce, bechamel sauce, and parmesan <span class="food-price">€16.95</span></li>
<li><strong>Linguine alle Vongole:</strong>linguine pasta with clams, garlic, white wine, and parsley <span class="food-price">€18.95</span></li>
<li><strong>Penne all'Arrabbiata:</strong>penne pasta in a spicy tomato sauce with garlic and chili<span class="food-price">€16.95</span></li>
</ul>
</div>
</div>
<div class="food-selection float-left"> <!-- Dessert container -->
<div class="food-heading">
<div id="dessert" class="food-menu-item-image"> <!-- Dessert image -->
</div>
</div>
<div class="food-details"> <!-- Dessert heading & list -->
<h2>Desserts :</h2>
<ul>
<li><strong>Tiramisu:</strong>layers of ladyfingers soaked in espresso and mascarpone cream <span class="food-price">€6.95</span></li>
<li><strong>Cannoli:</strong>crispy pastry tubes filled with sweet ricotta and chocolate chips <span class="food-price">€5.95</span></li>
<li><strong>Panna Cotta:</strong>a creamy dessert made with milk, cream, and sugar, caramel sauce <span class="food-price">€6.95</span></li>
<li><strong>Zabaione:</strong> a light custard made with egg yolks, sugar, Marsala wine, berries biscotti <span class="food-price">€6.95</span></li>
</ul>
</div>
</div>
<div class="food-selection float-right"> <!-- Gelato container -->
<div class="food-heading">
<div id="gelato" class="food-menu-item-image"> <!-- Gelato image -->
</div>
</div>
<div class="food-details"> <!-- Gelato heading & list -->
<h2>Gelato :</h2>
<ul>
<li>Italian-style ice cream made with milk, cream, and various flavors</li>
<li><strong>pistachio, chocolate, or strawberry</strong> <span class="food-price">€4.95</span></li>
</ul>
</div>
</div>
</main>
<footer class="header-footer"> <!-- Set footer -->
<ul id="footer-details"> <!-- Contact details list -->
<li>
<span class="hide-less-950"> <!-- Opening hours & "hiding" span -->
<i class="fa-solid fa-clock"></i>
: 16-23 daily
</span>
</li>
<li>
<a href="tel:0861234567" title="Ring us !"> <!-- Phone number & tel link -->
<i class="fa-solid fa-phone"></i>
<span class="hide-less-950"> : 086 123 45 67</span>
</a>
</li>
<li>
<a href="mailto:info@cibo-fresco.ie" title="Email us !"> <!-- Email address & mailto link -->
<i class="fa-solid fa-envelope"></i>
<span class="hide-less-950"> : info@cibo-fresco.ie</span>
</a>
</li>
</ul>
<ul id="socials"> <!-- Social icons list -->
<li><a href="https://www.facebook.com/" aria-label="Visit our Facebook page (Opens in new tab)" target="_blank" rel="noopener" title="Check our Facebook page !"><i class="fa-brands fa-square-facebook"></i></a></li>
<li><a href="https://www.twitter.com/" aria-label="Visit our Twitter page (Opens in new tab)" target="_blank" rel="noopener" title="Check our Twitter page !"><i class="fa-brands fa-square-twitter"></i></a></li>
<li><a href="https://www.instagram.com/" aria-label="Visit our Instagram page (Opens in new tab)" target="_blank" rel="noopener" title="Check our Instagram page !"><i class="fa-brands fa-square-instagram"></i></a></li>
</ul>
</footer>
<script src="https://kit.fontawesome.com/5c3b7bf139.js" crossorigin="anonymous"></script> <!-- FontAwesome -->
</body>
</html>