fermdez/SW
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Improvements in the Responsive Layout

Browse Source
This commit is contained in:
Fernando Méndez
2021-03-17 11:01:05 +01:00
committed by GitHub
parent 00cde61b10
commit 24bfe4c0fc
1 changed files with 19 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
assets/css/main.css
View File

@@ -149,7 +149,7 @@ table a{
}
/* Responsive layout: makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 800px) {
@media (max-width: 1000px) {
.column.side, .column.middle, .column.left, .column.right{
width: 100%;
}
@@ -175,16 +175,10 @@ table a{
overflow-x: auto;
overflow-y: auto;
}
.code h1{
.code h1, .code h2{
color: #dadada;
}
.code h2 {
color: #dadada;
}
.code h3 {
color: #d3ebff;
}
.code h4 {
.code h3, .code h4 {
color: #d3ebff;
}
.code p {
@@ -229,7 +223,7 @@ table a{
/* Sketches */
.sketches{
.sketches {
text-align: center;
display: block;
line-height: 1.25em;
@@ -239,22 +233,10 @@ table a{
border-radius: 3px;
height: 680px;
}
.sketches h1 {
.sketches h1, .sketches h2, .sketches h3, .sketches h4, .sketches p {
color: #dadada;
}
.sketches h2 {
color: #dadada;
}
.sketches h3 {
color: #dadada;
}
.sketches h4 {
color: #dadada;
}
.sketches p {
color: #dadada;
}
.sketches img{
.sketches img {
width: 550px;
height: 550px;
}
@@ -262,6 +244,16 @@ table a{
color: #d3ebff;
}
/* Responsive layout */
@media (max-width: 1500px) {
.column.side .sketches, .column.middle .sketches {
width: 100%;
height: 500px;
}
.column.side .sketches img, .column.middle .sketches img{
width: 100%;
height: 75%;
}
}
@media (max-width: 1150px) {
.sketches img{
width: 100%;