From 696781c256e8dd01cfeeb2b35a578a3346897395 Mon Sep 17 00:00:00 2001 From: Thomas Voss Date: Fri, 2 Jun 2023 15:48:35 +0200 Subject: More mobile friendliness --- src/style.css | 47 +++++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 43 insertions(+), 4 deletions(-) (limited to 'src/style.css') diff --git a/src/style.css b/src/style.css index 3e14f98..f9581f2 100644 --- a/src/style.css +++ b/src/style.css @@ -161,10 +161,28 @@ nav ul > * { } header h1 { - font-size: 3rem; + font-size: 2rem; margin-bottom: 0; } +@media only screen and (min-width: 1000px) { + header h1 { + font-size: 2.5rem; + } +} + +@media only screen and (min-width: 1400px) { + header h1 { + font-size: 2.7rem; + } +} + +@media only screen and (min-width: 1800px) { + header h1 { + font-size: 3rem; + } +} + header h6 { font-style: italic; font-size: 1.1rem; @@ -175,25 +193,28 @@ header h6 { p { text-align: justify; - font-size: 1.5rem; + font-size: 1.3rem; line-height: 2.5rem; width: 95%; } @media only screen and (min-width: 1000px) { p { + font-size: 1.4rem; width: 75%; } } @media only screen and (min-width: 1400px) { p { + font-size: 1.5rem; width: 65%; } } @media only screen and (min-width: 1800px) { p { + font-size: 1.5rem; width: 50%; } } @@ -433,7 +454,7 @@ main section { max-width: 100%; text-align: center; table-layout: fixed; - font-size: 1rem; + font-size: 0.8rem; background-color: var(--secondary-darker-color); border-radius: 16px; border-left: 16px solid var(--secondary-darker-color); @@ -586,5 +607,23 @@ main section { .coin-table sup, .commemorative-table sup { color: inherit; - font-size: 0.8rem; + font-size: 0.5rem; +} + +@media only screen and (min-width: 1000px) { + .coin-table sup, .commemorative-table sup { + font-size: 0.6rem; + } +} + +@media only screen and (min-width: 1400px) { + .coin-table sup, .commemorative-table sup { + font-size: 0.7rem; + } +} + +@media only screen and (min-width: 1800px) { + .coin-table sup, .commemorative-table sup { + font-size: 0.8rem; + } } -- cgit v1.2.3