-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
64 lines (64 loc) · 3.29 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="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css" />
<title>Swifter ou cambista?</title>
</head>
<body>
<header></header>
<main>
<!--<section class="pagina-principal">-->
<div class="fundo">
<div class="imagem-principal">
<img class="imagem" src="imagens\foto-cambista-taylor.svg" alt="Foto da cantora Taylor Swift e de um homem preso por fazer câmbio de ingresso em 2023">
</div>
<div class="box-inicial">
<p class="titulo">Você é quantos % swifter e quantos % cambistas?</p>
<button class="botao-comecar">começar</button>
</div>
<div class="box-regras">
<p class="intertitulo">...mas antes, as regras do jogo:</p>
<p class="texto">1. O jogo é composto por <span class="negrito">cinco perguntas</span></p>
<p class="texto">2. Você terá <span class="negrito">15 segundos</span> para responder cada uma delas</p>
<p class="texto">3. Caso você deixe a página do jogo, <span class="negrito">ele é automaticamente encerrado</span> e você é classificado como cambista</p>
<div class="conteiner-botao-bora-la">
<button id="botao-bora-la">bora, lá!</button></div>
</div>
</div>
<div class="pergunta">
<!--Conteúdo fake-->
<div class="box-pergunta">
<div class="timer">
<p class="timer-conteudo-fixo">Tempo para responder:</p>
<p class="timer-conteudo-fluido">15 seg</p>
</div>
<p class="titulo-pergunta">Pergunta pergunta pergunta pergunta pergunta pergunta pergunta pergunta pergunta pergunta pergunta pergunta pergunta pergunta?</p>
<button id="opcao-1" class="resposta">Opção 1</button>
<button id="opcao-2" class="resposta">Opção 2</button>
<button id="opcao-3" class="resposta">Opção 3</button>
</div>
<div class="box-justificativa">
<p class="resultado">Resultado resultado</p>
<p class="texto-justificativa">Justificativa justificativa justificativa justificativa justificativa justificativa justificativa justificativa justificativa justificativa</p>
<div class="conteiner-botao">
<button class="botao-proxima">próxima</button></div>
</div>
</div>
</div>
<div class="box-resultado">
<!--Conteúdo fake-->
<div class="box-resultado-titulo">
<p class="titulo-resultado">TITULO TITULO TITULO</p>
</div>
<div class="box-resultado-texto">
<img class="imagem-resultado" src="foto-taylor-resultado.png" alt="">
<p class="texto-resultado">texto texto texto texto texto</p>
</div>
</div>
</main>
<script src="https://cdn.jsdelivr.net/npm/d3@7"></script>
<script src="script.js"></script>
</body>
</html>