Improve mobile layout

This commit is contained in:
Ariejan de Vroom 2023-02-28 10:11:27 +01:00
parent 8c86f0e9a6
commit be83722dea
Signed by: ariejan
GPG Key ID: AD739154F713697B
2 changed files with 19 additions and 14 deletions

View File

@ -71,7 +71,7 @@ h1, h2, h3, h4, h5 {
font-size: $header_size; font-size: $header_size;
font-weight: bold; font-weight: bold;
font-variant: small-caps; font-variant: small-caps;
line-height: $header_size * 1.1; line-height: $header_size * 1.7;
color: $header; color: $header;
margin: 0.67rem 0; margin: 0.67rem 0;
} }
@ -212,12 +212,16 @@ table td, table th {
padding: 0.2rem 1rem; padding: 0.2rem 1rem;
} }
@media(min-width:768px) {
.flex-columns { .flex-columns {
display: flex; display: flex;
flex-direction: row; // flex-direction: row;
flex-flow: row wrap;
} }
.flex-column { .flex-column {
width: 50%;
&#popular_posts { &#popular_posts {
order: 1; order: 1;
} }
@ -225,6 +229,7 @@ table td, table th {
order: 2; order: 2;
} }
} }
}
img.about-avatar { img.about-avatar {
width: 16rem; width: 16rem;