-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
200 lines (166 loc) · 8.28 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
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/png" href="media/icon.png">
<link rel="stylesheet" type="text/css" href="style.css">
<title>MiauAu</title>
</head>
<body>
<header>
<a href="#"><img src="media/icon.png" alt="Logo"></a>
<menu>
<a href="dog/dog.html"><li>CACHORROS</li></a>
<a href="cat/cat.html"><li>GATOS</li></a>
<a href="#dicas-adoção"><li>DICAS DE ADOÇÃO</li></a>
<a href="#footer"><li>CONTATO</li></a>
</menu>
</header>
<main>
<article>
<div class="logo">
<h1>MIAU<font color="#8A0F0F">AU</font></h1>
<img src="media/icon.png" alt="Logo">
</div>
<h2>As <font color ="#8A0F0F">patinhas</font> que mostram a <font color="#8A0F0F">beleza</font> da vida</h2>
</article>
<div class="slogan">
<p>Onde cada <font color="#8A0F0F">miau miau</font> e <font color="#8A0F0F">au au</font> ganham destaque.</p>
</div>
</main>
<section id="dog-cat">
<div class="per">
<h3>Você é mais uma...</h3>
</div>
<div class="cards">
<a href="dog/dog.html">
<aside class="dog">
<article>
<h4 id="dog">Dog</h4><h4>person</h4>
</article>
</aside>
</a>
<p>Ou</p>
<a href="cat/cat.html">
<aside class="cat">
<article>
<h4 id="cat">Cat</h4><h4>person</h4>
</article>
</aside>
</a>
</div>
</section>
<section id="dicas-adoção">
<div class="titulo">
<img src="media/adotar-logo.png" alt="Logo adoção">
<h1>Quer <font color="#8A0F0F">adotar</font> um pet?</h1>
</div>
<article class="dica a">
<aside class="content">
<div class="t-container">
<h1 id="dica">Dica 1</h1>
<h2>Prepare-se</h2>
</div>
<div class="dica-container">
<p>Antes de adotar um animal, é preciso pensar bem. Não é uma decisão que se toma de uma hora para outra. Você tem que avaliar se pode oferecer tudo o que o pet precisa, como alimentação, saúde, carinho, tempo e espaço adequado (dependendo do tipo de animal que você quer). Por isso, pesquise sobre os cuidados que cada espécie exige, converse com amigos que já têm bichinhos e, se achar necessário, procure um veterinário.</p>
</div>
</aside>
<img src="media/img-1.png" alt="Imagem 1">
</article>
<article class="dica b">
<aside class="content">
<div class="t-container">
<h1 id="dica">Dica 2</h1>
<h2>Prepare o ambiente</h2>
</div>
<div class="dica-container">
<p>O ambiente onde você vai colocar o seu animal é muito importante. Você deve preparar a sua casa para que ela seja segura e divertida para os pets. Cachorros grandes necessitam de lugares espaçosos, até mesmo quintais, para se movimentarem. Gatos gostam de estruturas altas, que eles possam subir e explorar. Procure adequar a sua casa ao pet que você quer adotar, e consulte o abrigo e os veterinários sobre o tamanho que ele pode alcançar e as melhores estruturas para a sua espécie.</p>
</div>
</aside>
<img src="media/img-2.png" alt="Imagem 2">
</article>
<article class="dica a">
<aside class="content">
<div class="t-container">
<h1 id="dica">Dica 3</h1>
<h2>Escute seu pet</h2>
</div>
<div class="dica-container">
<p>Quando você adotar um pet, é importante ter uma rotina e um ambiente seguro para ele, além de atender às suas necessidades específicas. Por exemplo, os gatos precisam de um lugar limpo e calmo, ter horários bem definidos e ficar em espaços protegidos (telar todas as janelas). Os cachorros precisam disso tudo e também de uma rotina de higiene, escovação e tempo para caminhadas. Ah, e acessórios: potes adequados para cada espécie, cobertores, camas ou caixas para dormir e escovas de pelo.</p>
</div>
</aside>
<img src="media/img-3.png" alt="Imagem 3">
</article>
<article class="dica b">
<aside class="content">
<div class="t-container">
<h1 id="dica">Dica 4</h1>
<h2>Guarde dinheiro</h2>
</div>
<div class="dica-container">
<p>Reserve uma quantia para exames preventivos e vacinação do seu animal. Ao adotar um pet, você precisa saber do abrigo se ele já foi vacinado e quais vacinas ele tomou, além de saber se ele já foi esterilizado. Algumas vacinas são gratuitas pelo sistema público, mas é sempre bom ter um dinheiro para a imunização dos peludos. Também priorize fazer exames para detectar doenças virais e comuns na região. Os gatos, por exemplo, devem fazer um exame de FIV ou FELV, a leucemia felina, que pode passar entre os gatinhos.</p>
</div>
</aside>
<img src="media/img-4.png" alt="Imagem 4">
</article>
</section>
<footer id="footer">
<section class="footer-content">
<article class="info">
<div class="logo">
<h1>MIAU<font color ="#8A0F0F">AU</font></h1>
<img src="media/icon.png" alt="Imagem 5">
</div>
<p>é um projeto sem fins lucrativos, um lugar onde cada miau miau e au au ganha destaque.</p>
</article>
<p>Feito com o ♥ por</p>
<div class="links">
<div>
<picture>
<a href="https://www.instagram.com/maria.glovacki/">
<img src="/media/instagram.png" alt="Logo Instagram">
<p>maria.glovacki</p>
</a>
</picture>
<picture>
<a href="https://github.com/glovackimax">
<img src="media/github.png" alt="Logo Github">
<p>glovackimax</p>
</a>
</picture>
</div>
<div>
<picture>
<a href="https://www.instagram.com/gabjoaoz/">
<img src="media/instagram.png" alt="Logo Instagram">
<p>gabjoaoz</p>
</a>
</picture>
<picture>
<a href="https://github.com/gabjoao">
<img src="media/github.png" alt="Logo Github">
<p>gabjoao</p>
</a>
</picture>
</div>
</div>
<div class="linha"></div>
<div class="direitos">
<p>
As imagens e informações sobre raças foram retiradas do <a href="https://www.thedogapi.com"> TheDogApi</a> e <a href="https://www.thecatapi.com">TheCatApi.</a> Todos os direitos reservados.</p>
<p>
As imagens de demonstração foram retiradas do <a href="https://www.freepik.com">Freepik.</a> Todos os direitos reservados.
</p>
<p>
Os ícones foram retirados do <a href="https://icons8.com.br">Icons8.</a> Todos os direitos reservados.
</p>
</div>
<div class="c">
<p>Sem cookies, apenas petiscos.</p>
<p>© gabjoao e glovackimax 2023</p>
</div>
</section>
</footer>
</body>
</html>