higor
/
bootcamp
0
0
Fork 0
Code Issues 0 Pull Requests 0 Projects 0 Releases 0 Wiki Activity
Browse Source

Inclusão da página formulario e alteração de CSS e HTML do projeto

master
higor 3 years ago
parent
d3d1c0525b
commit
cd50ede455
6 changed files with 130 additions and 6 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +1
    -0
      index.html
  2. +1
    -0
      natureza/extincoes/extincoes.html
  3. +36
    -0
      natureza/formulario/formulario.html
  4. +1
    -0
      natureza/formulario/salvar.html
  5. +70
    -0
      natureza/formulario/style.css
  6. +21
    -6
      natureza/parques/parques-naturais.html

+ 1
- 0
index.html View File

@ -7,6 +7,7 @@
<a class="active" href="/">Home</a> <a class="active" href="/">Home</a>
<a href="natureza/extincoes/extincoes.html">Extin&ccedil&otildees</a> <a href="natureza/extincoes/extincoes.html">Extin&ccedil&otildees</a>
<a href="natureza/parques/parques-naturais.html">Parques Naturais</a> <a href="natureza/parques/parques-naturais.html">Parques Naturais</a>
<a href="/natureza/formulario/formulario.html">Formul&aacuterio</a>
</div> </div>
</head> </head>
<body> <body>


+ 1
- 0
natureza/extincoes/extincoes.html View File

@ -7,6 +7,7 @@
<a href="/">Home</a> <a href="/">Home</a>
<a class="active" href="natureza/extincoes/extincoes.html">Extin&ccedil&otildees</a> <a class="active" href="natureza/extincoes/extincoes.html">Extin&ccedil&otildees</a>
<a href="/natureza/parques/parques-naturais.html">Parques Naturais</a> <a href="/natureza/parques/parques-naturais.html">Parques Naturais</a>
<a href="/natureza/formulario/formulario.html">Formul&aacuterio</a>
</div> </div>
</head> </head>
<body> <body>


+ 36
- 0
natureza/formulario/formulario.html View File

@ -0,0 +1,36 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<title>Formul&aacuterio</title>
<div class="header">
<a href="/">Home</a>
<a href="/natureza/extincoes/extincoes.html">Extin&ccedil&otildees</a>
<a href="/natureza/parques/parques-naturais.html">Parques Naturais</a>
<a class="active" href="/natureza/formulario/formulario.html">Formul&aacuterio</a>
</div>
</head>
<body>
<h3>Formul&aacuterio de cadastro</h3>
<div class="div-form">
<form action="salvar.html" target="iframe-submissao">
<label>Nome do animal </label>
<input type="text" name="nomeAnimal" placeholder="Digite o nome do animal"/>
<label>Quantidade:</label>
<input type="number" name="quantidade" placeholder="Digite a quantidade"/>
<label>Nome do parque:</label>
<input type="text" name="nomeParque" placeholder="Digite o nome do parque"/>
<label>Estado:</label>
<input type="text" name="estado" placeholder="Digite o estado"/>
<input type="submit" value="Submit">
</form>
</div>
<iframe name="iframe-submissao"></iframe>
</body>
<footer>
<div>
<strong>Copyright &copy 2023 Higor.</strong>
All rights reserved.
</div>
</footer>
</html>

+ 1
- 0
natureza/formulario/salvar.html View File

@ -0,0 +1 @@
Salvo com sucesso!

+ 70
- 0
natureza/formulario/style.css View File

@ -0,0 +1,70 @@
html {
font-family: Arial, Helvetica, sans-serif;
}
.header {
overflow: hidden;
background-color: #f1f1f1;
padding: 20px 10px;
}
.header a {
float: left;
color: black;
text-align: center;
padding: 12px;
text-decoration: none;
font-size: 18px;
line-height: 25px;
}
.header a:hover {
background-color: #ddd;
color: black;
}
.header a.active {
background-color: dodgerblue;
color: white;
}
footer {
position: fixed;
width: 100%;
display: block;
padding: 12px;
bottom: 0;
margin-right: 8px;
background-color: #f1f1f1;
}
input[type=text], input[type=number], select {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
border-radius: 4px;
box-sizing: border-box;
}
input[type=submit] {
width: 100%;
background-color: #4CAF50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
border-radius: 4px;
cursor: pointer;
}
input[type=submit]:hover {
background-color: #45a049;
}
.div-form {
border-radius: 5px;
background-color: #f2f2f2;
padding: 20px;
}

+ 21
- 6
natureza/parques/parques-naturais.html View File

@ -6,6 +6,7 @@
<a href="/">Home</a> <a href="/">Home</a>
<a href="/natureza/extincoes/extincoes.html">Extin&ccedil&otildees</a> <a href="/natureza/extincoes/extincoes.html">Extin&ccedil&otildees</a>
<a class="active" href="natureza/parques/parques-naturais.html">Parques Naturais</a> <a class="active" href="natureza/parques/parques-naturais.html">Parques Naturais</a>
<a href="/natureza/formulario/formulario.html">Formul&aacuterio</a>
</div> </div>
</head> </head>
<body> <body>
@ -19,25 +20,30 @@
<tbody> <tbody>
<tr> <tr>
<th>Parque Nacional da Chapada Diamantina</th> <th>Parque Nacional da Chapada Diamantina</th>
<td>1520</td>
<td class="qtd">1520</td>
</tr> </tr>
<tr> <tr>
<th>Parque Nacional Montanhas de Tumucumaque</th> <th>Parque Nacional Montanhas de Tumucumaque</th>
<td>38874</td>
<td class="qtd">38874</td>
</tr> </tr>
<tr> <tr>
<th>Parque Nacional da Tijuca</th>
<td>39,58</td>
<th>Parque Nacional da Chapada das Mesas</th>
<td class="qtd">1600</td>
</tr> </tr>
<tr> <tr>
<th>Parque Nacional dos Len&ccedil&oacuteis Maranhenses</th> <th>Parque Nacional dos Len&ccedil&oacuteis Maranhenses</th>
<td>1566,84</td>
<td class="qtd">1566</td>
</tr> </tr>
<tr> <tr>
<th>Parque Nacional da Chapada dos Veadeiros</th> <th>Parque Nacional da Chapada dos Veadeiros</th>
<td>2405,9</td>
<td class="qtd">2405</td>
</tr> </tr>
</tbody> </tbody>
<tfoot>
<tr>
<td id="qtdTotal" colspan="2"></td>
</tr>
</tfoot>
</table> </table>
</body> </body>
<footer> <footer>
@ -46,4 +52,13 @@
All rights reserved. All rights reserved.
</div> </div>
</footer> </footer>
<script>
var els = document.getElementsByClassName("qtd");
var total = 0;
[].forEach.call(els, function (el)
{
total += parseInt(el.innerHTML);
});
document.getElementById("qtdTotal").innerHTML = total;
</script>
</html> </html>

Write Preview
Loading…
Cancel
Save