hcbarros
/
extincoes
1
0
Fork 0
Code Issues 0 Pull Requests 0 Projects 0 Releases 0 Wiki Activity
Browse Source

css

master
hcbarros 3 years ago
parent
06308547a2
commit
cfa8865207
5 changed files with 428 additions and 0 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +83
    -0
      extincoes.css
  2. +129
    -0
      formulario.css
  3. +39
    -0
      index.css
  4. +80
    -0
      menu.css
  5. +97
    -0
      parques-naturais.css

+ 83
- 0
extincoes.css View File

@ -0,0 +1,83 @@
@import url('./menu.css');
body {
margin: 0;
}
h1 {
text-align: center;
}
.extincoes-container {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
width: 100vw;
}
footer {
position: absolute;
bottom: 50px;
text-align: center;
margin-inline: 20px;
}
.table-content {
display: flex;
justify-content: center;
margin-top: 50px;
min-width: 700px;
}
.table-content table {
width: 50vw;
min-width: 600px;
background-color: rgb(250, 250, 250);
}
.table-content table, .table-content th, .table-content td {
border-collapse: collapse;
border: 1px solid black;
border-inline: none;
text-align: center;
border-color: #999
}
.table-content tr {
height: 35px;
}
.caption {
display: flex;
justify-content: center;
font-weight: bold;
font-size: 20px;
margin-bottom: 10px;
}
@media (max-width: 750px) {
.table-content table {
width: 80vw;
min-width: 0;
}
}
@media (max-width: 350px) {
.table-content table {
width: 95vw;
min-width: 0;
}
}
@media (max-height: 570px) {
footer {
position: relative;
padding-top: 100px;
}
}

+ 129
- 0
formulario.css View File

@ -0,0 +1,129 @@
@import url('./menu.css');
body {
margin: 0;
}
h1 {
text-align: center;
}
.formulario-container {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
width: 100vw;
}
.form-content {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
min-height: 560px;
padding-bottom: 20px;
}
fieldset {
border-radius: 7px;
width: 550px;
margin-inline: 10px;
border-color: #996dff;
}
legend {
font-weight: bold;
font-size: 20px;
}
input[type='text'] {
border: none;
border-bottom: 1px solid black;
outline: none;
width: 320px;
border-color: #996dff;
padding-left: 10px;
}
td {
height: 40px;
font-size: 18px;
}
button {
font-size: 16px;
font-weight: bold;
width: 120px;
height: 40px;
margin-block: 5px;
border-radius: 5px;
cursor: pointer;
background-color: #734bd1;
color: #fff;
border: none;
transition-duration: 0.4s;
}
button:hover {
background-color: #9466ff;
}
footer {
padding-bottom: 50px;
text-align: center;
margin-inline: 20px;
}
iframe {
width: 300px;
height: 100px;
border: 2px solid #734bd1;
border-radius: 5px;
margin-top: 50px;
}
.msg-sucesso {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
width: 100vw;
height: 100vh;
font-weight: bold;
font-size: 10vw;
text-align: center;
}
@media (max-width: 600px) {
fieldset, input[type='text'] {
width: 60vw;
}
}
@media (max-width: 450px) {
fieldset, input[type='text'] {
width: 40vw;
}
}
@media (max-width: 350px) {
iframe {
width: 85vw;
}
}
@media (max-width: 280px) {
fieldset, input[type='text'] {
width: 35vw;
}
legend {
font-size: 7vw;
}
td {
font-size: 6.5vw;
}
}

+ 39
- 0
index.css View File

@ -0,0 +1,39 @@
@import url('./menu.css');
body {
margin: 0;
}
h1 {
text-align: center;
}
.extincoes-container {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
width: 100vw;
}
footer {
position: absolute;
bottom: 50px;
text-align: center;
margin-inline: 20px;
}
.img-fauna {
width: 100%;
margin-top: 50px;
}
@media (max-height: 570px) {
footer {
position: relative;
padding-top: 100px;
}
}

+ 80
- 0
menu.css View File

@ -0,0 +1,80 @@
nav {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
height: 50px;
border-bottom: 1px solid black;
}
nav a img, ul img {
width: 53px;
}
.menu-control, .label-icon, ul img {
display: none;
}
.menu {
display: flex;
list-style: none;
}
.menu li {
margin-right: 50px;
cursor: pointer;
}
@media (max-width: 750px) {
nav {
flex-direction: row-reverse;
}
.label-icon, ul img {
display: block;
}
.label-icon {
margin-left: 10px;
cursor: pointer;
}
.label-icon img {
height: 30px;
}
.menu {
top: 0;
padding-top: 50px;
width: 200px;
justify-content: flex-start;
align-items: center;
text-align: center;
flex-direction: column;
position: fixed;
right: 0;
background-color: #fff;
height: 100%;
z-index: 1;
box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.4);
transform: translateX(110%);
transition: transform 0.5s ease;
}
.menu li {
margin-top: 30px;
}
.menu-control:checked + .menu {
transform: translateX(0);
}
}
@media (max-width: 350px) {
.menu {
width: calc(25px + 50%);
}
}

+ 97
- 0
parques-naturais.css View File

@ -0,0 +1,97 @@
@import url('./menu.css');
body {
margin: 0;
}
h1 {
text-align: center;
}
.parques-container {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
width: 100vw;
}
footer {
padding-bottom: 50px;
text-align: center;
margin-inline: 20px;
}
.table-content {
display: flex;
justify-content: center;
margin-top: 80px;
min-width: 700px;
min-height: 585px;
}
.table-content table {
width: 50vw;
min-width: 600px;
background-color: rgb(250, 250, 250);
}
.table-content table, .table-content th, .table-content td {
border-collapse: collapse;
border: 1px solid black;
border-inline: none;
text-align: left;
border-color: #999
}
.colspan {
font-weight: bold;
width: 100%;
text-align: center;
padding-left: 0;
}
.table-content tr {
height: 35px;
}
.caption {
display: flex;
justify-content: center;
font-weight: bold;
font-size: 25px;
margin-bottom: 10px;
}
@media (max-width: 750px) {
.table-content th, .table-content td {
padding-inline: 10px;
}
.table-content table {
min-width: 220px;
width: 90vw;
}
}
@media (max-width: 380px) {
.table-content th, .table-content td {
padding-inline: 5px;
}
}
@media (max-width: 330px) {
.table-content th, .table-content td {
word-break: break-all;
}
.table-content table {
width: 95vw;
}
}
@media (max-width: 260px) {
.caption {
font-size: 9.8vw;
}
}

Write Preview
Loading…
Cancel
Save