index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<title>Aluraconf</title>
<link rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" href="css/base.css">
<link rel="stylesheet" href="css/header.css">
<link rel="stylesheet" href="css/about.css">
<link rel="stylesheet" href="css/speakers.css">
<link rel="stylesheet" href="css/form.css">
</head>
<body>
<header class="header">
<nav class="main-menu">
<ul>
<li class="menu-item">
<a href="#panel-about">Sobre</a>
</li>
<li class="menu-item">
<a href="#panel-speakers">Palestrantes</a>
</li>
</ul>
</nav>
<div class="jumbotron">
<section class="panel-main">
<h1 class="title">ALURACONF</h1>
<h2 class="subtitle">30MAIO|RIO</h2>
</section>
<section class="panel-subscribe">
<a href="#panel-form" class="button">Inscreva-se</a>
</section>
</div>
</header>
<section class=" panel-about">
<h2 class="title">Muito conteúdo: do frontend ao backend</h2>
<h3 class="subtitle">30 de Maio de 2017 - na Cidade Maravilhosa</h3>
<div class="about-description">
<p>
Com a AluraConf abordaremos o que há de novidade e conhecimentos essenciais a um desenvolver mobile.
</p>
<p>
É uma grande chance de ficar por dentro dos assuntos de Android, iOS, Web mobile, desenvolvimento híbrido, UX, além da
parte backend com Rest, Microservices, e BigData. O desenvolvedor atualizado vai estar aqui.
</p>
</div>
<section class="panel-speakers">
<h2 class="title">PALESTRANTES</h2>
<h3 class="subtitle">
Aprenda com palestrantes que são referências na comunidade
</h3>
<ul class="speakers">
<li class="speaker">
<figure class="speaker-portrait">
<img src="img/palestrantes/placeholder.jpeg" alt="foto do palestrante">
<figcaption class="speaker-name">
Flávio Almeida
</figcaption>
<p class="speaker-bio">
Desenvolvedor e instrutor - Alura/Caelum
</p>
</figure>
<p class="speaker-speach">To be or not to be MEAN</p>
</li>
</ul>
</section>
<section class="panel-form">
<div class="container">
<h2 class="title">Seus dados</h2>
<form>
<div class="field">
<label CLASS="field-label">Nome</label>
<input class="field-input">
</div>
<div class="field">
<label class="field-label">E-mail</label>
<input class="field-input">
</div>
<div class="button-place">
<button class="button">REALIZAR INSCRIÇÃO</button>
</div>
</form>
</div>
</section>
<script src="js/jquery.js"></script>
<script src="js/index.js"></script>
</body>
</html>
