-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
64 lines (57 loc) · 3.73 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
<!DOCTYPE html>
<html lang="pt-br">
<head>
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="preconnect" href="https://fonts.googleapis.com">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap" rel="stylesheet">
<link rel="shortcut icon" href="images/favicon.jpg" type="image/x-icon">
<link rel="stylesheet" href="style.css">
<title>Camp.in</title>
</head>
<body>
<div class="page">
<header>
<img src="images/logo.svg" alt="Logo Camp.in">
</header>
<main>
<form>
<fieldset>
<div class="legend">
<img src="images/log-in.svg" alt="seta amarela e um símbolo de fechamento de chave">
<legend>Faça seu login</legend>
</div>
<p class="subtitle">Entre com suas informações de cadastro.</p>
<div class="input-wrap">
<label for="user-email">E-mail</label>
<input type="text" id="user-email" placeholder="Digite seu e-mail">
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3.33329 3.33331H16.6666C17.5833 3.33331 18.3333 4.08331 18.3333 4.99998V15C18.3333 15.9166 17.5833 16.6666 16.6666 16.6666H3.33329C2.41663 16.6666 1.66663 15.9166 1.66663 15V4.99998C1.66663 4.08331 2.41663 3.33331 3.33329 3.33331Z" stroke="#AFB6C2" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M18.3333 5L9.99996 10.8333L1.66663 5" stroke="#AFB6C2" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</div>
<div class="input-wrap">
<label for="user-password">Senha</label>
<input type="password" id="user-password" placeholder="Digite sua senha">
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M15.8333 9.16666H4.16667C3.24619 9.16666 2.5 9.91285 2.5 10.8333V16.6667C2.5 17.5871 3.24619 18.3333 4.16667 18.3333H15.8333C16.7538 18.3333 17.5 17.5871 17.5 16.6667V10.8333C17.5 9.91285 16.7538 9.16666 15.8333 9.16666Z" stroke="#AFB6C2" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M5.83337 9.16666V5.83332C5.83337 4.72825 6.27236 3.66845 7.05376 2.88704C7.83516 2.10564 8.89497 1.66666 10 1.66666C11.1051 1.66666 12.1649 2.10564 12.9463 2.88704C13.7277 3.66845 14.1667 4.72825 14.1667 5.83332V9.16666" stroke="#AFB6C2" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</div>
<div class="remember">
<div class="checkbox-wrap">
<input type="checkbox" id="remember-me">
<label for="remember-me">Lembre-me</label>
</div>
<a href="#">Esqueci minha senha</a>
</div>
<button>ENTRAR</button>
<p class="no-account">Não tem uma conta? <a href="#">Registre-se</a></p>
</fieldset>
</form>
<img src="images/side-image.jpg" alt="Carro com cabana acoplada parado ao lado de um lago.">
</main>
</div>
</body>
</html>