-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
271 lines (251 loc) · 12.5 KB
/
Copy pathindex.html
File metadata and controls
271 lines (251 loc) · 12.5 KB
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
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>Gaming Developers - Jogue, crie e faça comunidades</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@400;700&family=Work+Sans:wght@400;700&display=swap" rel="stylesheet">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
</head>
<body>
<!-- header -->
<header class="header-bg" data-menu="header-bg">
<div class="header container" data-menu="header">
<!-- logo -->
<a href="index.html" class="logo"><img src="assets/gd-icons/logo.png" alt="Logo da Gaming Developers"></a>
<!-- menu -->
<nav class="menu">
<input type="checkbox" class="check-menu" name="check" id="check-menu">
<label for="check-menu" data-menuToggle="button" aria-expanded="false" aria-controls="menu"><span></span><span></span><span></span></label>
<ul>
<li class="menu-ativo"><a href="#"><img src="assets/menu/pagina-inicial.svg"> Home</a></li>
<li><a href="facaparte.html"><img src="assets/menu/time-menu.svg"> Faça parte</a></li>
<li><a href="loja.html"><img src="assets/menu/loja.svg"> Loja</a></li>
</ul>
</nav>
<!-- redes sociais -->
<div class="redes-sociais redes-header">
<ul>
<li><a href="#"><img class="rs-icon rs-header" src="assets/social/instagram.svg" alt="Instagram"></a></li>
<li><a href="#"><img class="rs-icon rs-header" src="assets/social/twitter.svg" alt="Twitter"></a></li>
<li><a href="#"><img class="rs-icon rs-header" src="assets/social/discord.svg" alt="Discord"></a></li>
</ul>
</div>
</div>
</header>
<main class="body-item">
<!-- intro -->
<section class="intro-bg">
<div class="intro container">
<!-- intro texto -->
<div class="intro-texto">
<h1 class="titulo t-inicial">Gaming Developers</h1>
<h2 class="subtitulo-intro">Jogue, crie e faça comunidades</h2>
<!-- fundador -->
<div class="fundador">
<figure>
<img class="i-fundador" src="assets/gd-icons/sohGustavo.png" alt="sohGustavo">
</figure>
<div>
<strong class="t-fundador">sohGustavo</strong>
<p class="p-fundador">Fundador da startup</p>
</div>
</div>
<!-- quote -->
<blockquote class="quote">
<p>“A Gaming Developers é uma startup que contribui para criação de jogos indies e também não indies, onde nós desenvolvemos jogos nos nossos próprios estúdios e contribuímos para recrutamento.”</p>
</blockquote>
</div>
<!-- intro imagem -->
<figure class="intro-imagem">
<img src="assets/gd-icons/gd-icon-intro.png" alt="Imagem da Gaming Developers">
</figure>
</div>
</section>
<!-- história -->
<section class="historia-bg">
<div class="historia container">
<!-- história texto -->
<div class="historia-texto">
<h2 class="titulo">Nossa História</h2>
<p class="paragrafo p-historia">Sou um jovem empreendedor e desenvolvedor de games, com uma ideia revolucionária, a qual acredito que contribuirá para o desenvolvimento do mercado. Oferecemos suporte a todos que tem interesse em desenvolver seu próprio jogo, ou empresa relacionada ao mesmo, inteligentes para empresas de todos os tamanhos e nos orgulhamos do nosso serviço excepcional. Na Gaming Developers, acreditamos que o conhecimento e a ousadia tecnológica podem levar sua empresa ou seu jogo, ao sucesso. Entre em contato para mais informações.</p>
<span class="e-mail e-historia" title="Mande um e-mail para Gaming Developers."><img src="assets/email.svg"> jsilva.gh21@gmail.com</span>
</div>
<!-- história imagem -->
<figure class="historia-imagem">
<img src="assets/icons/historia-icon.svg" alt="Menino e menina com um controle de Ps4">
</figure>
</div>
</section>
<!-- tecnologia -->
<section class="tecnologia-bg">
<div class="tecnologia container">
<!-- tecnologia imagem -->
<figure class="tecnologia-imagem">
<img src="assets/icons/tecnologia-icone.svg" alt="Homem programando em vários computadores">
</figure>
<!-- tecnologia texto -->
<div class="tecnologia-texto">
<h2 class="titulo">Nossa Tecnologia Inovadora</h2>
<p class="paragrafo t-paragrafo">Na Gaming Developers, nossa ampla gama de soluções tecnológicas ajuda indivíduos e empresas líderes em seu segmento, alcançarem o sucesso que desejam. Nossa plataforma oferece diversas opções, que foram criadas com o intuito de ajudar as pessoas a desenvolverem seu projeto da melhor forma. Para permitir que nossos usuários tenham uma experiência cada vez melhor, a Gaming Developers está continuamente melhorando sua tecnologia, então fique ligado para saber mais sobre upgrades e outras mudanças.</p>
</div>
</div>
</section>
<!-- doações -->
<section class="doacoes-bg">
<div class="doacoes container">
<!-- doações texto -->
<div class="doacoes-texto">
<h2 class="titulo">Doações</h2>
<p class="paragrafo d-paragrafo">Para nos ajudar a construir esse projeto e realizar nossas metas, sua contribuição é essencial, caso possa, em doações. Conto com sua ajuda</p>
<!-- lista doações -->
<ul class="lista-doacoes">
<li><img src="assets/check.svg"> Seguro</li>
<li><img src="assets/check.svg"> Doação pelo Paypal</li>
<li><img src="assets/check.svg"> Cartão ou boleto</li>
</ul>
<!-- botão doações -->
<a href="#"><button class="botao-contribuir">Contribuir</button></a>
</div>
<!-- doações imagem -->
<figure class="doacoes-imagem">
<img src="assets/icons/doacao-icone.svg" alt="Homem alcançando metas">
</figure>
</div>
</section>
<!-- perguntas frequentes -->
<section class="faq-bg">
<div class="faq container">
<!-- faq imagem -->
<figure class="faq-imagem">
<img src="assets/icons/faq-icon.svg" alt="Homem e mulher junto a um ponto de interrogação">
</figure>
<!-- faq texto -->
<h2 class="titulo wide-item t-faq">Perguntas Frequentes</h2>
<div class="faq-texto">
<!-- pergunta 1 -->
<div class="faq-container">
<input type="checkbox" id="pergunta1" name="perguntas" class="faq-checkbox">
<label for="pergunta1">
<div class="faq-pergunta">Como irei saber sobre as atualizações dos jogos? <img class="faq-seta" src="assets/faq-seta.svg"></div>
</label>
<div class="faq-resposta"><p>Fique ligado na nossa plataforma, logo estaremos informando.</p></div>
</div>
<!-- pergunta 2 -->
<div class="faq-container">
<input type="checkbox" id="pergunta2" name="perguntas" class="faq-checkbox">
<label for="pergunta2">
<div class="faq-pergunta">Vocês ensinam a desenvolver jogos? <img class="faq-seta" src="assets/faq-seta.svg"></div>
</label>
<div class="faq-resposta"><p>No momento não, mas futuramente podemos pensar nisso.</p></div>
</div>
<!-- pergunta 3 -->
<div class="faq-container">
<input type="checkbox" id="pergunta3" name="perguntas" class="faq-checkbox">
<label for="pergunta3">
<div class="faq-pergunta">Tenho uma ideia de jogo, como faço para recrutar a equipe da Gaming Developers? <img class="faq-seta" src="assets/faq-seta.svg"></div>
</label>
<div class="faq-resposta"><p>Através de nosso e-mail ou outros meios de contato.</p></div>
</div>
</div>
</div>
</section>
<!-- faça parte -->
<section class="faca-parte-bg">
<div class="faca-parte container">
<!-- faça parte texto -->
<h2 class="titulo wide-item t-faca-parte">Faça parte da Gaming Developers</h2>
<div class="faca-parte-texto">
<h3 class="titulo t-footer">Saiba como funciona nosso sistema</h3>
<p class="paragrafo p-faca-parte">Nossa empresa de desenvolvimento de jogos está germinando, e em crescente produção. Com isso, estamos em busca de interessados para atuar nos cargos que mais se encaixam, como forma de contribuição, e futuramente, como parte da empresa. Saiba mais clicando no botão abaixo</p>
<a href="facaparte.html"><button class="botao-contribuir">Fazer parte</button></a>
</div>
<!-- faça parte imagem -->
<figure class="faca-parte-imagem">
<img src="assets/icons/facaparte-home.svg" alt="Ilustração de uma página na web de trabalhadores">
</figure>
</div>
</section>
</main>
<!-- footer -->
<section class="info-footer-bg body-item">
<div class="info-footer container">
<!-- contato -->
<div class="contato-footer item-footer">
<h3 class="titulo t-footer">Contato</h3>
<span class="e-mail" title="Mande um e-mail para Gaming Developers."><img src="assets/email.svg"> jsilva.gh21@gmail.com</span>
</div>
<!-- redes sociais -->
<div class="redes-sociais rs-footer item-footer">
<h3 class="titulo t-footer">Redes Sociais</h3>
<ul>
<li><a href="#"><img class="rs-icon rs-footer" src="assets/social/instagram.svg" alt="Instagram"></a></li>
<li><a href="#"><img class="rs-icon rs-footer" src="assets/social/twitter.svg" alt="Twitter"></a></li>
<li><a href="#"><img class="rs-icon rs-footer" src="assets/social/discord.svg" alt="Discord"></a></li>
</ul>
</div>
<!-- páginas -->
<div class="paginas-footer item-footer">
<h3 class="titulo t-footer">Páginas</h3>
<ul>
<li><a href="#">Home</a></li>
<li><a href="facaparte.html">Faça parte</a></li>
<li><a href="loja.html">Loja</a></li>
</ul>
</div>
<!-- doação footer -->
<div class="doacao-footer item-footer">
<h3 class="titulo t-footer">Doe</h3>
<a href="#"><button class="botao-contribuir">Contribuir</button></a>
</div>
<!-- footer imagem -->
<figure class="footer-imagem item-footer">
<img src="assets/gd-icons/gd-icon-footer.png" alt="Gaming Developers Logo">
</figure>
</div>
</section>
<footer class="footer-bg body-item">
<div class="footer container">
<p class="paragrafo p-footer">© Copyright 2021 Gaming Developers - Todos direitos reservados</p>
</div>
</footer>
<!-- modal para contato -->
<div id="modal-contato" class="modal-container">
<div class="modal">
<h3 class="titulo t-modal">Mande um e-mail para Gaming Developers</h3>
<form class="form-modal">
<label for="nome" class="label">Nome</label>
<input id="nome" type="text" class="input">
<label for="email" class="label">E-mail</label>
<input id="email" type="text" class="input">
<label for="mensagem" class="label">Mensagem</label>
<textarea id="mensagem" rows="8" class="textarea"></textarea>
<div class="btn-acoes">
<button class="botao-contribuir btn-enviar">Enviar</button>
<span class="botao-contribuir btn-cancelar" id="btn-cancelar">Cancelar</span>
</div>
</form>
</div>
</div>
<!--
<form action="enviar.php" method="post" name="form" class="formphp">
<label for="nome">Nome</label>
<input id="nome" name="nome" type="text">
<label for="email">E-mail</label>
<input id="email" name="email" type="text">
<label for="telefone">Telefone</label>
<input id="telefone" name="telefone" type="text">
<label class="nao-aparece">Se você não é um robô, deixe em branco.</label>
<input type="text" class="nao-aparece" name="leaveblank">
<label class="nao-aparece">Se você não é um robô, não mude este campo.</label>
<input type="text" class="nao-aparece" name="dontchange" value="http://" >
<label for="mensagem">Mensagem</label>
<textarea name="mensagem" id="mensagem"></textarea>
<button id="enviar" name="enviar" type="submit">Enviar</button>
</form>
-->
<script src="js/script.js"></script>
</body>
</html>