smaller header for mobile layout

This commit is contained in:
error 2023-10-24 20:14:17 +02:00
parent c3d393742d
commit 52d9812439

View File

@ -37,7 +37,7 @@ body {
background-color: var(--background); background-color: var(--background);
font-family: 'Maven Pro'; font-family: 'Maven Pro';
box-sizing: border-box; box-sizing: border-box;
padding: 2ch; padding: 2ch 1ch;
display: grid; display: grid;
grid-template-columns: 1fr 8rem 50rem 16rem 1fr; grid-template-columns: 1fr 8rem 50rem 16rem 1fr;
grid-template-rows: 1fr auto 1fr; grid-template-rows: 1fr auto 1fr;
@ -289,7 +289,7 @@ label.sidenote-toggle {
@media (max-width: 74rem) { @media (max-width: 74rem) {
body { body {
grid-template-columns: 1fr 8rem calc(100vw - 9rem) 1fr; grid-template-columns: 1fr 6rem calc(100vw - 9rem) 1fr;
} }
label.sidenote-toggle:not(.sidenote-number) { label.sidenote-toggle:not(.sidenote-number) {
@ -301,13 +301,14 @@ label.sidenote-toggle {
} }
.sidenote-toggle:checked + .sidenote { .sidenote-toggle:checked + .sidenote {
display: block; display: block;
margin-top: 0.5rem; margin: 0.5rem 5%;
margin-bottom: 0.5rem; float: none;
margin-left: 5%; clear: both;
margin-right: 5%; width: 90%;
float: none; }
clear: both;
width: 90%; body > header > a > h1 {
font-size: 3rem;
} }
} }