style: resize some bits on small screens
authorFrédéric Péters <fpeters@0d.be>
Fri, 26 Mar 2021 10:16:32 +0000 (11:16 +0100)
committerFrédéric Péters <fpeters@0d.be>
Fri, 26 Mar 2021 10:16:32 +0000 (11:16 +0100)
chloro/phyll/static/css/style.scss

index 874cd9b..8bb69bb 100644 (file)
@@ -59,6 +59,9 @@ main, footer {
        margin: 0 4em;
        padding: 1em;
        max-width: 70em;
+       @media screen and (max-width: 50em) {
+               margin: 0;
+       }
 }
 
 main {
@@ -74,6 +77,9 @@ main {
                display: inline-block;
                text-decoration: none;
                font-size: 500%;
+               @media screen and (max-width: 50em) {
+                       font-size: 200%;
+               }
                font-weight: bold;
                padding-top: 0.5em;
                line-height: 50%;
@@ -96,6 +102,9 @@ main {
                h2 {
                        margin: 0;
                        font-size: 400%;
+                       @media screen and (max-width: 50em) {
+                               font-size: 200%;
+                       }
                        font-weight: bold;
                        text-transform: uppercase;
                }