From e715ff8a38131f4604918bd41085f8955c9d8c8c Mon Sep 17 00:00:00 2001
From: timvisee <tim@visee.me>
Date: Fri, 24 Apr 2020 11:28:41 +0200
Subject: [PATCH] Make landing page text larger on big screens

---
 themes/zenn/sass/_config.scss      |  1 +
 themes/zenn/sass/_landing.scss     |  4 ++++
 themes/zenn/sass/_responsive.scss  | 10 ++++++++++
 themes/zenn/templates/landing.html | 14 ++++++++------
 4 files changed, 23 insertions(+), 6 deletions(-)

diff --git a/themes/zenn/sass/_config.scss b/themes/zenn/sass/_config.scss
index eeb59b6..03bb7fd 100644
--- a/themes/zenn/sass/_config.scss
+++ b/themes/zenn/sass/_config.scss
@@ -1,4 +1,5 @@
 // Responsive sizes
+$responsive-big: 1200px;
 $responsive-small: 900px;
 $responsive-mini: 550px;
 $responsive-tiny: 425px;
diff --git a/themes/zenn/sass/_landing.scss b/themes/zenn/sass/_landing.scss
index 23f517e..794f9f8 100644
--- a/themes/zenn/sass/_landing.scss
+++ b/themes/zenn/sass/_landing.scss
@@ -21,6 +21,10 @@ header#headertron {
         height: 2.5em;
     }
 
+    .nav {
+        display: none;
+    }
+
     .links {
         display: flex;
         align-content: flex-start;
diff --git a/themes/zenn/sass/_responsive.scss b/themes/zenn/sass/_responsive.scss
index 795a949..a8d96ff 100644
--- a/themes/zenn/sass/_responsive.scss
+++ b/themes/zenn/sass/_responsive.scss
@@ -40,6 +40,10 @@
     header#headertron {
         font-size: 1.6em;
 
+        .nav {
+            display: block;
+        }
+
         .links {
             justify-content: space-evenly;
 
@@ -72,3 +76,9 @@
         flex-direction: column;
     }
 }
+
+@media (min-width: $responsive-big) {
+    header#headertron {
+        font-size: 3em;
+    }
+}
diff --git a/themes/zenn/templates/landing.html b/themes/zenn/templates/landing.html
index 938a69a..7081931 100644
--- a/themes/zenn/templates/landing.html
+++ b/themes/zenn/templates/landing.html
@@ -8,12 +8,14 @@
         <i>I am a developer</i><br>
         <i>I consume coffee</i><br>
         <i>I build & break software</i><br>
-        <div class="delimiter"></div>
-        <div class="links">
-            <a href="{{ get_url(path="@/projects.md") | safe }}">Projects</a>
-            <a href="{{ get_url(path="@/blog/_index.md") | safe }}">Blog</a>
-            <a href="{{ get_url(path="@/about.md#me-on-the-web") | safe }}">Me on the web</a>
-            <a href="{{ get_url(path="@/about.md") | safe }}">About</a>
+        <div class="nav">
+            <div class="delimiter"></div>
+            <div class="links">
+                <a href="{{ get_url(path="@/projects.md") | safe }}">Projects</a>
+                <a href="{{ get_url(path="@/blog/_index.md") | safe }}">Blog</a>
+                <a href="{{ get_url(path="@/about.md#me-on-the-web") | safe }}">Me on the web</a>
+                <a href="{{ get_url(path="@/about.md") | safe }}">About</a>
+            </div>
         </div>
     </header>
 {% endblock headertron %}