From dd183a3b4232e7e293ff3ceba0d807f41a462f0b Mon Sep 17 00:00:00 2001
From: Jeddunk <jedithug985@cock.li>
Date: Thu, 7 Jan 2021 14:28:00 +0100
Subject: [PATCH] fixed header logo not fitting on smaller screen fixed icon
 padding

---
 src/components/Header.svelte | 13 +++++++++++--
 src/routes/index.svelte      |  3 ++-
 2 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/components/Header.svelte b/src/components/Header.svelte
index 4f9c9dc..127a14b 100644
--- a/src/components/Header.svelte
+++ b/src/components/Header.svelte
@@ -4,16 +4,25 @@
 
 <style>
     .logo {
-        height: 5.65rem;
         -ms-interpolation-mode: nearest-neighbor;
         image-rendering: -moz-crisp-edges;
         image-rendering: pixelated;
     }
+    @media screen and (min-width: 768px){
+        .logo {
+            height: 5.65rem;
+        }
+    }
+    @media screen and (max-width: 767px){
+        .logo {
+            width: 100%;
+        }
+    }
 </style>
 
 <div class="jumbotron">
     <div class="container">
-        <img src="{logo}" class="logo" alt="">
+        <img src="{logo}" class="img-fluid logo" alt="">
     </div>
 </div>
 
diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index b9dd0b1..f392c6e 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -7,11 +7,12 @@
     .custom-link, .custom-link:hover {
         color:#EBEBEB;
         text-decoration: none;
+        padding: 1em;
     }
 
     .container-extra {
         background-color: rgb(39, 56, 73);
-        padding: 2em;
+        padding: 1em 2em;
     }
 
     .hvr-float {