Skip to content

Commit

Permalink
Initial commit
Browse files Browse the repository at this point in the history
  • Loading branch information
GabrielZolk committed Sep 27, 2022
0 parents commit 18009b0
Show file tree
Hide file tree
Showing 7 changed files with 226 additions and 0 deletions.
2 changes: 2 additions & 0 deletions .gitattributes
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
# Auto detect text files and perform LF normalization
* text=auto
Binary file added assets/pista.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/skate-por-do-sol.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/skate-virado.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/skate.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
221 changes: 221 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,221 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
<link rel="stylesheet" href="style.css">
</head>

<body>
<nav class="navbar navbar-expand-lg" style="background-color: #00a4ff;">
<div class="container">
<a class="navbar-brand fw-bold text-light" href="#">SkatePark</a>

<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"
style="background-color: #fff">

<span class="navbar-toggler-icon"></span>
</button>

<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link text-light" href="#">Pista</a>
</li>
<li class="nav-item">
<a class="nav-link text-light" href="#">Aulas</a>
</li>
<li class="nav-item">
<a class="nav-link text-light" href="#">Contato</a>
</li>
<li class="nav-item">
<a class="nav-link text-light" href="#">Matricule-se</a>
</li>
</ul>
</div>

</div>
</nav>

<section class="d-flex align-items-end py-5" style="min-height: 60vh;
background-image: url(./assets/skate-por-do-sol.jpg); background-position: center; background-size: cover;">


<div class="container">
<h1 class="fw-bold text-light display-3">Escola de Skate</h1>
</div>
</section>

<section class="container py-5">
<div class="row">
<div class="col-12 col-lg-6 col-xxl-5">
<img src="./assets/pista.jpg" class="img-fluid" alt="Pista da escola Skate Park">
</div>
<div class="col-12 col-lg-6 col-xxl-7">
<h2 class="display-4 fw-semibold mb-4"><span class="highlight">Aulas</span> em uma das maiores pistas de
<span class="highlight">Curitiba.</span>
</h2>
<p>A <strong>Skate Park Curitiba</strong> é uma <strong>área de lazer</strong> que conta com
<strong>professores especializados</strong> em ajudar crianças e adultos a experimentar uma nova
atividade superando seus limites com <strong>segurança</strong> e <strong>diversão!</strong>
</p>
</div>
</div>
</section>

<section style="background-color: rgba(124, 169, 194, 0.25)">
<div class="container py-5">
<h2 class="display-6 fw-bold text-center mb-3">Aulas</h2>
<div class="row">
<div class="col">
<div class="card">
<div class="card-body">
<h5 class="card-title text-uppercase text-center">Infantil</h5>
<ul style="padding-left: 1rem">
<li>
Público entre 5 e 15 anos
</li>
<li>
Equipamentos fornecidos
</li>
<li>
Horários de Seg. à Sab.
</li>
<li>
2 Horas por aula
</li>
</ul>
<p class="card-text highlight fw-bold">R$ 49,00 / Aula</p>
<a href="#" class="btn btn-primary text-uppercase w-100">Matricule-se</a>
</div>
</div>
</div>
<div class="col">
<div class="card">
<div class="card-body">
<h5 class="card-title text-uppercase text-center">Infantil</h5>
<ul style="padding-left: 1rem">
<li>
Público entre 5 e 15 anos
</li>
<li>
Equipamentos fornecidos
</li>
<li>
Horários de Seg. à Sab.
</li>
<li>
2 Horas por aula
</li>
</ul>
<p class="card-text highlight fw-bold">R$ 49,00 / Aula</p>
<a href="#" class="btn btn-primary text-uppercase w-100">Matricule-se</a>
</div>
</div>
</div>
<div class="col">
<div class="card">
<div class="card-body">
<h5 class="card-title text-uppercase text-center">Infantil</h5>
<ul style="padding-left: 1rem">
<li>
Público entre 5 e 15 anos
</li>
<li>
Equipamentos fornecidos
</li>
<li>
Horários de Seg. à Sab.
</li>
<li>
2 Horas por aula
</li>
</ul>
<p class="card-text highlight fw-bold">R$ 49,00 / Aula</p>
<a href="#" class="btn btn-primary text-uppercase w-100">Matricule-se</a>
</div>
</div>
</div>

</div>

</div>
</section>

<section class="d-flex align-items-center py-5" style="min-height: 60vh;
background: linear-gradient(
0deg,
rgba(0, 194, 228, 0.8),
rgba(0, 0, 0, 0.2)
), url(./assets/skate-virado.jpg); background-position: center; background-size: cover;">


<div class="container text-center">
<h2 class="fw-bold text-light display-3">“O skate é a base da liberdade...”</h2>
<p class="fw-bold text-light">KarenStuart</p>
</div>
</section>

<section class="container py-5">
<h2 class="display-6 fw-bold text-center mb-3">Contato</h2>

<div class="row">
<div class="col-5">
<form action="">
<div class="mb-3">
<label for="nome" class="form-label">Nome</label>
<input type="text" class="form-control" placeholder="Informe seu nome" id="nome" />
</div>
<div class="mb-3">
<label for="nome" class="form-label">Email</label>
<input type="email" class="form-control" placeholder="Informe seu email" id="nome" />
</div>
<div class="mb-3">
<label for="mansagem" class="form-label">Mensagem</label>
<textarea class="form-control" placeholder="Digite sua mensagem" id="mensagem"></textarea>
</div>
<button type="submit" class="btn btn-primary">Enviar mensagem</button>
</form>
</div>
<div class="col-5 offset-2">
<div class="mb-3">
<strong class="fs-4">Endereço</strong>
<p class="mb-0 fs-5">Rua Daventura, 156</p>
<p class="mb-0 fs-5">Curitiba - PR</p>
</div>
<div class="mb-3">
<strong class="fs-4">Email e Telefone</strong>
<p class="mb-0 fs-5">[email protected]</p>
<p class="mb-0 fs-5">(41)99999-9999</p>
</div>
<div class="mb-3">
<strong class="fs-4">Horários</strong>
<p class="mb-0 fs-5">De Segunda à Sexta</p>
<p class="mb-0 fs-5">Das 09h às 19h</p>
<p class="mb-0 fs-5">Sábado das 09h ás 17h</p>
</div>
</div>
</div>
</section>

<footer style="background-color: #00a4ff">
<div class="container py-3 d-flex align-items-center justify-content-between">
<p class="mb-0 text-light fw-bold"> <span class="text-uppercase"> SkatePark 2022</span> - Alguns direitos
reservados.</p>
<img src="./assets/skate.png" class="img-responsive" alt="ícone de skate">
</div>

</footer>

</body>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-u1OknCvxWvY5kfmNBILK2hRnQC3Pr17a+RTT6rIHI7NnikvbZlHgTPOOmMi466C8"
crossorigin="anonymous"></script>

</html>
3 changes: 3 additions & 0 deletions style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
.highlight {
color: #00a4ff
}

0 comments on commit 18009b0

Please sign in to comment.