From 78b9ac82dc4d46f21ad11aeeda70d753f1331da4 Mon Sep 17 00:00:00 2001
From: Dan Suster <dan@thegolem.cz>
Date: Mon, 4 Jan 2021 20:33:33 +0100
Subject: [PATCH] smaller logo on mobile

---
 pages/index.vue | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/pages/index.vue b/pages/index.vue
index bd68250..f9f2db8 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -2,11 +2,11 @@
   <div class="flex flex-col h-screen w-screen bg-white dark:bg-gray-darkest">
     <div class="absolute inset-0 flex flex-col">
       <div class="m-auto text-center">
-        <Logo class="m-0" :img-src="iconGolemSrc" />
-        <h1 class="text-4xl md:text-6xl text-gray-darkest dark:text-gray-lightest">
+        <Logo class="m-auto logo" :img-src="iconGolemSrc" />
+        <h1 class="text-3xl md:text-6xl text-gray-darkest dark:text-gray-lightest">
           TheGolem.cz
         </h1>
-        <h2 class="text-2xl md:text-4xl text-gray-darkest dark:text-gray-lightest">
+        <h2 class="text-1xl md:text-4xl text-gray-darkest dark:text-gray-lightest">
           One server to host them all!
         </h2>
       </div>
@@ -43,6 +43,15 @@ export default {
 }
 </script>
 
-<style>
+<style scoped>
+.logo {
+  max-width: 340px;
+}
+
+@media (min-width: 768px) {
+  .logo {
+    max-width: 440px;
+  }
+}
 
 </style>