-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
179 lines (160 loc) · 8.18 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
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
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="Mellon's Burguer: Comida Saborosa com gosto de quero mais!">
<meta name="keywords" content="lanche, fastfood, comida, fome, preço">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author" content="Vitor Hugo Pires dos Santos">
<title>Mellon's Burguer</title>
<link rel="stylesheet" href="./assets/css/style.css">
<link href='https://unpkg.com/boxicons@2.1.2/css/boxicons.min.css' rel='stylesheet'>
<link rel="shortcut icon" href="./assets/img/burger.png" type="image/x-icon">
</head>
<body>
<header class="header">
<a href="./index.html" class="logo">Bem vindo!</a>
<nav class="menu">
<ul class="menu-itens">
<li class="item"><a href="index.html">Início</a></li>
<li class="item"><a href="#about">Sobre</a></li>
<li class="item"><a href="#cardapio">Menu</a></li>
<li class="item"><a href="#services">Serviços</a></li>
<li class="item"><a href="">Contato</a></li>
</ul>
</nav>
</header>
<main>
<section class="home">
<div class="home-content-left">
<h1 class="main-title">Mellon's Burguer</h1>
<h2 class="subtitle">Lanches <br> com gosto de quero <br> mais!</h2>
<a href="#cardapio"><button class="btn">Menu de Hoje</button></a>
</div>
<div class="home-content-right">
<img src="./assets/img/mainImage.png" class="mainImage" alt="Imagem Principal de Introdução">
</div>
</section>
<section class="about" id="about">
<div class="about-content-left">
<img src="./assets/img/secundaryImage.png" class="imgAbout" alt="Imagem de Sobre nós">
</div>
<div class="about-content-right">
<header class="header-about">
<h3 class="titleAbout">Sobre nós</h3>
<h2 class="subtitle">Trabalhamos com os
melhores ingredientes</h2>
</header>
<p class="descAbout">Empresa que já está no ramo desde 2022, começando com delivery e logo estaremos com nossa loja física.</p>
<a href=""><button class="btn">Saiba mais...</button></a>
</div>
</section>
<section class="cardapio" id="cardapio">
<header class="header-cardapio" id="cardapio">
<h3 class="titleCardapio">Nosso Cardápio</h3>
<h2 class="subtitle">Venha saborear nossos lanches com ótimos preços</h2>
</header>
<main class="main-cardapio">
<div class="cardItem">
<box-icon class="bx bx-cart-alt"></box-icon>
<img src="./assets/img/burguer1.png" class="img-cardapio" alt="Imagem do Hambúrguer de Frango">
<h3>Hambúrguer de frango</h3>
<p>150g de frango grelhado com nosso molho especial</p>
<p class="preco">R$ 15.00</p>
</div>
<div class="cardItem">
<box-icon class="bx bx-cart-alt"></box-icon>
<img src="./assets/img/burguer2.png" class="img-cardapio" alt="Imagem do Hambúrguer Especial da Casa">
<h3>Hambúrguer especial da casa</h3>
<p>150g de picanha com nosso molho especial</p>
<p class="preco">R$ 20.00</p>
</div>
<div class="cardItem">
<box-icon class="bx bx-cart-alt"></box-icon>
<img src="./assets/img/pctFrango.png" class="img-cardapio" alt="Imagem do Pacote de Frango Frito Crocante">
<h3>Pacote de Frango Frito Crocante</h3>
<p>200g de frango frito feito em 5 minutos</p>
<p class="preco">R$ 25.00</p>
</div>
</main>
</section>
<section class="services" id="services">
<header class="header-services">
<h4 class="titleServices">Nossos Serviços</h4>
<h2 class="subtitle">Alguns tópicos para saber mais sobre a lanchonete
</h2>
</header>
<main class="main-services">
<div class="cardItem service">
<img src="./assets/img/box.png" alt="" class="img-services">
<h3>Ordem</h3>
<p class="descServices">Temos a responsabilidade de agradar nossos clientes com os nossos lanches.</p>
</div>
<div class="cardItem service">
<img src="./assets/img/truck.png" alt="" class="img-services">
<h3>Fornecedores</h3>
<p class="descServices">Produtos selecionados para melhor servi-lo.</p>
</div>
<div class="cardItem service">
<img src="./assets/img/card.png" alt="" class="img-services">
<h3>Delivery</h3>
<p class="descServices">Você pode pedir nossa comida através do nosso sistema de delivery se preferir. <br> Bon appétit!</p>
</div>
</main>
</section>
<section class="pedido">
<div class="pedido-content">
<h2 class="titlePedido">Faça seu pedido já!</h2>
<a href="#"><button class="btn">Delivery</button></a>
</div>
</section>
</main>
<footer class="footer">
<section class="links menu">
<header>
<h4 class="titleFooter">Link de Menu</h4>
<div class="risco"></div>
</header>
<main class="linksFooter">
<ul class="linksList">
<li><a href="./index.html">Início</a></li>
<li><a href="#about">Sobre</a></li>
<li><a href="#cardapio">Menu</a></li>
<li><a href="#services">Serviços</a></li>
<li><a href="#contact">Contato</a></li>
</ul>
</main>
</section>
<section class="links servicos">
<header>
<h4 class="titleFooter">Nossos Serviços</h4>
<div class="risco"></div>
</header>
<main class="linksFooter">
<ul class="linksList">
<li><a href="#">Web Design</a></li>
<li><a href="#">Desenvolvimento Web</a></li>
<li><a href="#">Marketing</a></li>
<li><a href="#">Gestão de Produtos</a></li>
<li><a href="#">Design Gráfico</a></li>
</ul>
</main>
</section>
<section class="links informations">
<head>
<h4 class="titleFooter">Informações</h4>
<div class="risco"></div>
</head>
<main class="linksFooter">
<ul class="linksList">
<li><a href="#">Sobre Nós</a></li>
<li><a href="#">Informação de Entrega</a></li>
<li><a href="#">Política de Privacidade</a></li>
<li><a href="#">Termos E Condições</a></li>
</ul>
</main>
</section>
</footer>
</body>
</html>