-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy pathindex.html
203 lines (199 loc) · 10.3 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
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
<!DOCTYPE html>
<html lang="pt-br">
<head>
<title>Doce Lar</title>
<meta charset="utf-8">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@100;300;800&display=swap" rel="stylesheet">
<link href= "https://fonts.googleapis.com/css2?family=Righteous&display=swap" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="assets/style.css">
</head>
<body>
<header> <!-- RESPONSÁVEL PELA BRANCH: Pâmela Ferreira Lima https://github.com/pamelaferreiralima/M1T5-Pascoa.git -->
<!-- div que servirá de contaneir para todos meus elementos que devem ficar ao topo da tela-->
<div class="topbar-container">
<!--seção para a logo-->
<section class="logo">
<a href="#"> <img src="assets/images/icons8-birthday-cake-64 1.svg" alt="cake"> </a>
<a href="#"><h1>Doce Lar</h1></a>
</section>
<!--seção para o menu de navegação-->
<section class="header-navbar">
<ul class="menu">
<li><a href="#" class="products">Produtos</a></li>
<li><a href="#">Onde encontrar</a></li>
<li><a href="#">Contato</a></li>
</ul>
</section>
</div>
<!--seção com os demais elementos da tela-->
<section class="header-description">
<div class="box-description">
<p>Cada produto feito artesanalmente</p>
</div>
</section>
</header>
<main>
<section class="container">
<!--<div class="content">
<div class="wrap-box">-->
<div class="box-1-ovo-tradicional">
<img src="assets/images/box1.png" alt="Ovo de colher tradicional">
<span>Ovos de colher tradicionais a partir de 250g</span>
<button type="button">Comprar</button>
</div>
<div class="box-4-ovo-criancada">
<div class="desconto5"><span>5% de desconto</span></div>
<img src="assets/images/box4.png" alt="Ovos coloridos para brincar com a criançada">
<span>Ovos coloridos para brincar com a criançada</span>
<button type="button">Comprar</button>
</div>
<div class="box-2-ovo-colher">
<div class="desconto10"><span>10% de desconto</span></div>
<img src="assets/images/box2.png" alt="Ovo de colher especial">
<span>Ovos de colher especiais a partir de 350g</span>
<button type="button">Comprar</button>
</div>
<!--</div>-->
<!--<div class="wrap-box">-->
<div class="box-5-kit-trufa">
<img src="assets/images/box5.png" alt="Kits de Trufas a partir de 12 unidades">
<span>Kits de Trufas a partir de 12 unidades</span>
<button type="button">Comprar</button>
</div>
<div class="box-3-montar-cesta">
<div class="desconto13"><span>12% de desconto</span></div>
<img src="assets/images/box3.png" alt="Cesta de Chocolate monte você mesmo">
<span>Monte você mesmo sua cesta de Chocolate</span>
<button type="button">Comprar</button>
</div>
<div class="box-6-barra-crocante">
<img src="assets/images/box6.png" alt="Barras de Chocolate crocantes">
<span>Barras de Chocolate crocantes</span>
<button type="button">Comprar</button>
</div>
<!-- </div>
</div>-->
</section>
</main>
<footer> <!-- RESPONSÁVEL PELA BRANCH: Filipe Rimes https://github.com/frimes/M1T5-Pascoa.git -->
<section id="circles-area">
<div id="circles-boxes">
<div id="circles-left-box">
<figure class="circles-figure">
<img class="circles-img-box" src="assets\images\Ellipse 1.svg" alt="foto de placa estilizada escrita open shop relativa a loja de Laranjeiras">
</figure>
<a class="circles-text-box">
<span class="circles-title-text-box">
Laranjeiras
</span>
<span class="circles-open-day-text-box">
Seg 11h às 19h
</span>
<span class="circles-open-day-text-box">
Ter a Sexta 9h às 20h
</span>
<span class="circles-open-day-text-box">
Sáb e Dom 10h às 19h
</span>
<span class="circles-address-text-box">
Rua Ipiranga, 132 - Laranjeiras, Rio de Janeiro
</span>
</a>
</div>
<div id="circles-middle-box">
<figure class="circles-figure">
<img class="circles-img-box" src="assets\images\Ellipse 2.svg" alt="foto de ambiente de loja relativa a loja de Copacabana">
</figure>
<a class="circles-text-box">
<span class="circles-title-text-box">
Copacabana
</span>
<span class="circles-open-day-text-box">
Seg 11h às 19h
</span>
<span class="circles-open-day-text-box">
Ter a Sexta 10h às 21h
</span>
<span class="circles-open-day-text-box">
Sáb e Dom 11h às 20h
</span>
<span class="circles-address-text-box">
Av. Nossa Sra. de Copacabana, 978 - Rio de Janeiro
</span>
</a>
</div>
<div id="circles-right-box">
<figure class="circles-figure">
<img class="circles-img-box" src="assets\images\Ellipse 3.svg" alt="foto da vitrine de produtos relativa a loja da Vila Madalena">
</figure>
<a class="circles-text-box">
<span class="circles-title-text-box">
Vila Madalena
</span>
<span class="circles-open-day-text-box">
Segunda a Sábado 10 às 18h
</span>
<span class="circles-address-text-box">
Av. Brg. Faria Lima, 2232 - Jardim Paulistano, São Paulo
</span>
</a>
</div>
</div>
</section>
<section id="form-area">
<div id="form-title-box">
<a id="form-title-text">Contato</a>
</div>
<div id="form-box">
<form id="form-elem" action="">
<input class="form-larger-field" type="name" placeholder="Nome">
<span id="form-field-sb-box">
<input class="form-field" type="email" placeholder="E-mail">
<input class="form-field" type="tel" placeholder="Telefone">
</span>
<input class="form-larger-field" type="text" placeholder="Assunto">
<input id="form-larger-tall-field" type="text" placeholder="Mensagem">
<span id="form-field-button-box">
<button id="form-field-button" type="submit">ENVIAR</button>
</span>
</form>
</div>
</section>
<section id="icons-area">
<div id="icons-box">
<div id="icons-left-box">
<figure id="fig-left-box">
<div id="logo-footer-box">
<img id="logotipo-footer" src="assets\images\icons8-birthday-cake-64 1.svg" alt="logo da Doce Lar - o desenho de um pequeno bolo marrom, com calda escorrendo e com menos uma fatia">
</div>
<div id="tipo-footer-box">
<img id="logo-footer" src="assets\images\Doce Lar.svg" alt="Doce Lar escrito em laranja">
</div>
</figure>
</div>
<div id="icons-right-box">
<figure id="fig-right-box">
<div id="icon-fb-footer-box">
<a class="icon-hyperlink" href="https://facebook.com" target="_blank">
<img id="icon-fb-footer" src="assets\images\icons8-facebook-24 1.svg" alt="ícone do facebook">
</a>
</div>
<div id="icon-twt-footer-box">
<a class="icon-hyperlink" href="https://twitter.com" target="_blank">
<img id="icon-twt-footer" src="assets\images\icons8-twitter-24 1.svg" alt="ícone do twitter">
</a>
</div>
<div id="icon-insta-footer-box">
<a class="icon-hyperlink" href="https://instagram.com" target="_blank">
<img id="icon-insta-footer" src="assets\images\icons8-instagram-24 1.svg" alt="ícone do instagram">
</a>
</div>
</figure>
</div>
</div>
</section>
</footer>
</body>
</html>
</body>
</html>