Improved responsive on mobile

This commit is contained in:
Romain de Laage 2020-02-19 15:02:13 +01:00
parent b977d7a7ab
commit 35064176b9
1 changed files with 14 additions and 2 deletions

View File

@ -73,6 +73,7 @@ nav .logo img{
nav li{ nav li{
transition: 0.3s; transition: 0.3s;
line-height: 1.5em; line-height: 1.5em;
margin: 10px;
} }
nav li:hover{ nav li:hover{
background-color: rgba(255, 255, 255, 0.3); background-color: rgba(255, 255, 255, 0.3);
@ -91,7 +92,7 @@ table{
border-collapse: separate; border-collapse: separate;
border-spacing: 0; border-spacing: 0;
} }
@media screen and (min-width: 800px){ @media all and (min-width: 1100px){
td, th{ td, th{
border: solid #C0C0C0 1px; border: solid #C0C0C0 1px;
border-bottom: none; border-bottom: none;
@ -127,11 +128,17 @@ table{
background-color: rgba(255, 255, 255, 0.4); background-color: rgba(255, 255, 255, 0.4);
} }
} }
@media screen and (max-width: 800px){ @media all and (max-width: 1100px){
*{
font-size: 40px;
}
header{ header{
height: initial; height: initial;
line-height: initial; line-height: initial;
} }
header h1{
font-size: 100px;
}
footer{ footer{
height: initial; height: initial;
line-height: initial; line-height: initial;
@ -139,6 +146,7 @@ table{
nav{ nav{
width: 100%; width: 100%;
height: initial; height: initial;
text-align: center;
} }
nav .logo{ nav .logo{
display: none; display: none;
@ -147,6 +155,9 @@ table{
width: 100%; width: 100%;
height: initial; height: initial;
} }
section *{
margin: 5px;
}
table{ table{
width: 100%; width: 100%;
} }
@ -160,6 +171,7 @@ table{
display: block; display: block;
border-bottom: none; border-bottom: none;
text-align: center; text-align: center;
padding: 10px;
} }
tr:last-child td:last-child, tr:last-child th:last-child{ tr:last-child td:last-child, tr:last-child th:last-child{
border-bottom: solid #C0C0C0 1px; border-bottom: solid #C0C0C0 1px;