halfd/new-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Better sizing of text in mobile view, plus adjusted margins

Browse source
This commit is contained in:
Halfdan 2022-07-24 17:40:43 +02:00
parent 8317aefd4e
commit 46bc8bfa5d
1 changed files with 24 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
style.css
View file

@ -35,7 +35,7 @@ body {
line-height : 165%; line-height : 165%;
text-align : left; text-align : left;
border-right : var(--base-grid) solid var(--bar-color); //border-right : var(--base-grid) solid var(--bar-color);
} }
a { a {
@ -46,23 +46,31 @@ h1, h2, h3, h4, h5, h6 {
font-weight : 700; font-weight : 700;
} }
h1 { main h1 {
font-size : 2.5rem; font-size : 3rem;
margin : 0 0 2rem 0; margin : 0 0 3rem 0;
} }
h2 { main h2 {
font-size : 2rem; font-size : 2rem;
margin : 1.5rem 0 1rem 0; margin : 3.5rem 0 1.5rem 0;
} }
h3 { main h3 {
font-size : 1.5rem; font-size : 1.5rem;
margin : 1rem 0 0.5rem 0; margin : 2rem 0 1.5rem 0;
} }
p, ol, ul, code { main p, main code {
margin : 1rem 0; margin : 1.5rem 0;
}
main ol, main ul {
margin : 1.5rem;
}
main ol li, main ul li {
margin : 0.5rem 0;
} }
aside { aside {
@ -77,6 +85,7 @@ aside header, aside nav, aside footer {
} }
main { main {
width : 100vw;
max-width : 900px; max-width : 900px;
} }
@ -131,6 +140,11 @@ aside nav footer ol li a {
} }
@media(max-width:1000px) { @media(max-width:1000px) {
:root {
--base-grid : 40px;
--base-font-size : 30px;
}
body { body {
flex-direction : column; flex-direction : column;
border : 0; border : 0;