-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
139 lines (124 loc) · 4.59 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
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
<link rel="stylesheet" type="text/css" href="style.css">
<title>Rachi</title>
</head>
<body>
<nav>
<header>
<span><a href="index.html"><img src="imagens/logo.svg"></a></span>
<div class="mobile-menu">
<div class="line1"></div>
<div class="line2"></div>
<div class="line3"></div>
</div>
<ul class="nav-list">
<li><a href="#funcionalidades">Funcionalidades</a></li>
<li><a href="#app">App</a></li>
<li><a href="#planos">Planos</a></li>
<li><a href="#contato">Contato</a></li>
</ul>
</header>
</nav>
<section id="inicio">
<div>
<div>
<span>
<h1>Rachi, é tudo que você precisa em um só lugar.</h1>
<button>Cadastrar-se</button>
</span>
</div>
<article>
<img src="imagens/homem-na-pedra.svg"></img>
</article>
</div>
</section>
<section id="funcionalidades">
<span>
<h2>Como funciona</h2>
</span>
<article>
<div class="funcionalidade">
<img src="imagens/como-funciona/manplus.svg">
<h3>Crie conexões</h3>
<p>Lorem ipsum dolor sit amet consectetu.</p>
</div>
<div class="funcionalidade">
<img src="imagens/como-funciona/escudo.svg">
<h3>100% gratuito</h3>
<p>Lorem ipsum dolor sit amet consectetu.</p>
</div>
<div class="funcionalidade">
<img src="imagens/como-funciona/rosto.svg">
<h3>Compartilhamento</h3>
<p>Lorem ipsum dolor sit amet consectetu.</p>
</div>
</article>
</section>
<section id="app">
<div>
<div>
<span>
<h2>Baixe nosso app para desfrutar mais!</h2>
<p>Amet in elementum nulla scelerisque dui, egestas at. Elit consectetur turpis elementum amet vitae et etiam nec. Varius volutpat hac adipiscing tincidunt pretium.</p>
<span>
<img src="imagens/app/play-store.svg">
<img src="imagens/app/app-store.svg">
</span>
</span>
</div>
<article>
<img src="imagens/app/homem-sentado.svg"></img>
</article>
</div>
</section>
<section id="planos">
<div>
<span>
<h2>Nossos planos</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia mi quis euismod ultrices.</p>
</span>
<article>
<div>
<h3>Bronze</h3>
<img src="imagens/Planos/Preço.svg">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia mi quis euismod ultrices.</p>
<button>Assinar</button>
</div>
<div id="preferido">
<h3>Prata</h3>
<div>PREFERIDO</div>
<img src="imagens/Planos/Preço (1).svg">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia mi quis euismod ultrices.</p>
<button>Assinar</button>
</div>
<div>
<h3>Ouro</h3>
<img src="imagens/Planos/Preço (2).svg">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia mi quis euismod ultrices.</p>
<button>Assinar</button>
</div>
</article>
</div>
</section>
<section id="contato">
<div>
<h2>Contato</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia mi quis euismod ultrices.</p>
<span>
<input type="email" placeholder="Seu melhor e-mail">
<button type="submit">Enviar</button>
</span>
</div>
</section>
<footer>
<p>Desenvolvido por Lyzzandro Dualamo</p>
<p>Todos os direitos reservados.</p>
</footer>
<script src="mobile-navbar.js"></script>
</body>
</html>