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