-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
145 lines (136 loc) · 7.92 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
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="widht=device-widht, initial-scale=1">
<link rel="shortcut icon" href="imagens/logo-redondo.ico" />
<title>Classroom - Software de Estudos</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css" integrity="sha384-+d0P83n9kaQMCwj8F4RJB66tzIwOKmrdb46+porD/OvrJ+37WqIM7UoBtwHO6Nlg" crossorigin="anonymous">
<meta name="google-site-verification" content="5ay23HWKCPeOldMnEGKhVKHGmnc4WoD1xwH5V5ei3vA" />
<header class="cabecalho">
<a href="index.html" ><h1 class="logo">Classroom</h1></a>
<button class = "btn-menu"><img src = "imagens/menu.svg"></button>
<nav class="menu"><button class = "btn-close"><img src = "imagens/exit.svg"></button>
<ul>
<li><a href="#"><i class="fas fa-home"></i> Home</a></li>
<li><a href="#quemsomos"><i class="fas fa-users"></i> Quem Somos</a></li>
<li><a href="#aplicativo"><i class="fas fa-info"></i> Software</a></li>
<li><a href="#download"><i class="fas fa-download"></i> Download</a></li>
<li><a href="#faq"><i class="fas fa-question"></i> FAQ </a></li>
<li><a href="#contato"><i class="fas fa-comments"></i> Contato</a></li>
</ul>
</nav>
</header>
</head>
<body>
<div class="banner" >
<div class="title-banner">
<h2>ESTUDE NO MELHOR</h2>
<h3>Olá jovem padawan, seja bem-vindo ao Classroom, o software de estudos criado para você, que procura informações, testes e video-aulas, em uma plataforma bem programada e acessível. Baixe agora, e comece a sua jornada! </h3>
</div>
<div class="buttons-banner">
<a href="#aplicativo"><button class="btn-conheca"><img src = "imagens/conheca.svg"> Conheça </button></a>
<a href="#download"><button class="btn-download"><img src = "imagens/download.svg"> Download </button></a>
</div>
</div>
<main class="principal" id="quemsomos">
<article class="quemsomos" >
<h2>Quem Somos</h2>
<img src = "imagens/quem-somos.png"><br>
<p>O software Classroom se iniciou como um projeto de TCC dos 4 shinobis lendários da vila oculta da informática, da ETEC Lauro Gomes. Você quer saber o nome dos responsáveis? Ótimo! São eles:</p>
<br>
<p>- Antônio Muniz, mente brilhante responsável pelo site e pelo visual moderno do Classroom.</p>
<p>- Beatriz Vilas Boas, guardiã dos ensinamentos e administradora das páginas do Classroom online.</p>
<p>- Lais Cruz, a matriarca das informações, aquela que tudo sabe sobre o que entra e o que saí do reino
mágico do conhecimento.</p>
<p>- Luiz Prado, o deus por trás da programação, o criador do mundo Classroom.</p>
<br>
<p>A missão aceita por esses paladinos não foi apenas a construção de um projeto, mas a
criação de algo que fosse relevante, um instrumento para mudar as pessoas através do
conhecimento. E não pense você que a jornada acaba com o Classroom, pois essa história está
apenas começando.</p>
</article>
</main>
<main class="principal2" id="aplicativo">
<article class="aplicativo">
<h2>Software</h2>
<img src = "imagens/aplicativo1.gif"><br>
<p>Todas as lendas têm realmente um fundo de verdade?</p><br>
<p>A lenda em questão aqui conta a história de um software, o qual seria composto de resumos, exercícios de grandes vestibulares e video-aulas de mestres renomados. Além disso, muitos dizem que todas essas funções, poderiam ser acessadas a qualquer momento do dia, por qualquer um que se propusesse a clicar no botão de Download, e iniciar uma grande jornada de crescimento pessoal e conquistas infinitas.</p><br>
<p></p>
<p>Oh céus, não pode ser verdade! Deve ser realmente um mito do folclore brasileiro, não é mesmo?</p><br>
<p> Faça o download e descubra!</p>
<a href="#download"><button class="download-btn"><i class="fas fa-download"></i> Download </button></a>
</article>
</main>
<main class="principal3" id="download">
<article class="download" >
<h2>Download</h2>
<img src = "imagens/aKON.jpg"><br>
<p>Faça o download do Classroom, abra as portas para os estudos e inicie sua jornada com o
maior dos tesouros já nas suas mãos: A MANOPLA DO ENSINO!</p><br>
<p>Durante todo o árduo caminho que trilhar, você encontrará muitos desafios intelectuais, e para te auxiliar, nós, Os Paladinos do Conhecimento, iremos disponibilzar resumos e vídeo-aulas.</p>
<p>E a cada etapa haverá um desafio a ser superado, com os exercícios propostos.</p>
<p>Como recompensa: A JOIA DO CONHECIMENTO!</p>
<!--https://drive.google.com/open?id=1QfLghYtfIJXJFHjAlzK_ukvvh_yxHd_w-->
<a href="https://github.com/antuniooh/ClassroomProject" download>
<button class="download-btn"><i class="fas fa-download"></i> Baixe Agora </button></a></a>
</article>
</main>
<!--FAQ-->
<main class="principal-faq" id ="faq">
<article class = "faq" >
<h2>Perguntas Frequentes</h2>
<img src = "imagens/faq.gif">
<h1>Como posso me comunicar com os criadores?</h1><br>
<p>R: Bom meu jovem aprendiz, para estabelecer comunicação, você sempre pode acessar nossas
redes sociais, ou nos mandar um e-mail, basta dar uma rolada na página e escrever a mensagem e envia-la clicando no botão "Enviar" </p><br><br>
<h1>Onde posso fazer o Download?</h1><br>
<p>R: Para entrar nesse mundo mágico, basta ir até a página de download, e clicar no botão que
abrirá as portas para o conhecimento ilimitado.</p><br><br>
<h1>Quanto custa o uso do software?</h1><br>
<p>R: Sabe o que dizem sobre tudo que é bom não ser de graça? Bom, isso não se aplica aqui,
porque o software e todas as suas funções estão disponíveis gratuitamente para você, meu
jovem aprendiz.</p><br><br>
</article>
</main>
<!--Rodape-->
<footer class="rodape" id ="contato">
<h2>Contato</h2>
<p>Fale Conosco pelas nossas midias sociais</p>
<div class="social">
<form method="post" action="#">
<input type="hidden"name="redirect" value="#">
<input name="recipient" value="[email protected]" type="hidden">
<input type="message" name="message" placeholder="Escrever Mensagem" method="post" action="[email protected]">
<button class="enviar-btn">Enviar</button>
</form>
<br><br>
<a href="https://www.facebook.com/classroomcontato" target="_blank" class="tooltip" data-title="Conheça nosso perfil no Facebook!"><img src = "imagens/facebook.svg"></a>
<a href="https://twitter.com/ClassroomContat" target="_blank" class="tooltip" data-title="Conheça nosso perfil no Twitter!"><img src = "imagens/twitter.svg"></a>
<a href="https://www.youtube.com/channel/UCVupkrSlsYAbQ0Mpvo04r-Q/featured?view_as=subscriber" target="_blank" class="tooltip" data-title="Conheça nosso canal no Youtube!"><img src = "imagens/youtube.svg"></i></a>
<a href="https://plus.google.com/u/0/116290676849187664575" target="_blank" class="tooltip" data-title="Conheça nosso perfil no Google Plus!"><img src = "imagens/google.svg"></a>
</div>
<p>[email protected]</p>
<h1 class="copyright">Copyright © Classroom 2018. Todos os Direitos Reservados</h1>
</footer>
<script src="http://code.jquery.com/jquery-1.12.0.min.js"></script>
<script>
$(".btn-menu").click(function(){
$(".btn-menu").hide();
$(".menu").show();
});
$(".btn-close").click(function(){
$(".menu").hide();
$(".btn-menu").show();
});
</script>
<!--<script>
$(".menu li").click(function(){
$(".menu").hide();
$(".btn-menu").show();
});
</script>-->
</body>
</html>