From 39d4a7c2aecd09fc8d4dcbe437ebd58b868e9da2 Mon Sep 17 00:00:00 2001
From: Daniel Rudolf <github.com@daniel-rudolf.de>
Date: Mon, 1 Aug 2016 16:51:22 +0200
Subject: [PATCH] Hotfix for responsiveness of default theme

I'll completely refactor the default theme for Pico 1.1... The CSS is just broken.
---
 CHANGELOG.md              |  1 +
 themes/default/index.twig |  1 -
 themes/default/style.css  | 94 +++++++++------------------------------
 3 files changed, 21 insertions(+), 75 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 223b536..50916f9 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,7 @@ Released: -
 ```
 * [New] Add Pico's social icons to default theme
 * [Fixed] Fix handling of non-YAML 1-line front matters
+* [Fixed] Fix responsiveness in default theme
 ```
 
 ### Version 1.0.3
diff --git a/themes/default/index.twig b/themes/default/index.twig
index 8d6bc03..deba22e 100644
--- a/themes/default/index.twig
+++ b/themes/default/index.twig
@@ -22,7 +22,6 @@
         <div class="inner clearfix">
             <h1><a href="{{ "index"|link }}" id="logo">{{ site_title }}</a></h1>
             <nav>
-                <a href="#" class="menu-icon"></a>
                 <ul>
                     {% for page in pages if page.title %}
                         <li{% if page.id == current_page.id %} class="active"{% endif %}>
diff --git a/themes/default/style.css b/themes/default/style.css
index 0a5b09d..a8f3e1d 100644
--- a/themes/default/style.css
+++ b/themes/default/style.css
@@ -238,12 +238,6 @@ dd {
     margin: 0;
     float: left;
 }
-#header .menu-icon {
-    display: none;
-    width: 35px;
-    height: 35px;
-    background: #afe1da url(menu-icon.png) center;
-}
 #header nav {
     float: right;
     list-style: none;
@@ -254,10 +248,6 @@ dd {
     font-weight: bold;
     margin-left: 20px;
 }
-#header a:hover#menu-icon {
-    background-color: #444;
-    border-radius: 4px 4px 0 0;
-}
 #header ul {
     list-style: none;
 }
@@ -306,75 +296,31 @@ dd {
     }
     #header {
         margin-bottom: 40px;
+        padding: 30px 0;
     }
-    #header h1 a {
-        font-size:1em;
+    #header h1 {
+        float: none;
     }
-    #header .menu-icon {
-        display:inline-block;
+    #header nav {
+        float: none;
+        width: 100%;
     }
-    #header nav a { color: #000; }
-    #header nav a:hover { color: #afe1da; }
-    #header nav ul, nav:active ul {
-        display: none;
-        position: absolute;
-        padding: 20px;
-        background: #fff;
-        border: 5px solid #444;
-        right: 2.7em;
-        top: 100px;
-        width: 80%;
-        border-radius: 4px 0 4px 4px;
-        z-index: 9999;
+    #header nav ul {
+        padding: 0;
     }
     #header nav li {
-        text-align: center;
-        width: 100%;
-        padding: 10px 0;
-        margin: 0;
-    }
-    #header nav:hover ul {
-        display: block;
-    }
-}
-
-/* Extra Small Devices, Phones */
-@media only screen and (max-width : 480px) {
-    .inner {
-        width: 85%;
-    }
-    .inner img {
-        width:100%;
-    }
-    #header {
-        margin-bottom: 30px;
-    }
-    #header h1 a {
-        font-size:1em;
-    }
-    #header .menu-icon {
-        display:inline-block;
-    }
-    #header nav a { color: #000; }
-    #header nav a:hover { color: #afe1da; }
-    #header nav ul, nav:active ul {
-        display: none;
-        position: absolute;
-        padding: 20px;
-        background: #fff;
-        border: 5px solid #444;
-        right: 0em;
-        top: 100px;
-        width: auto;
-        border-radius: 4px 0 4px 4px;
-    }
-    #header nav li {
-        text-align: center;
-        width: 100%;
-        padding: 10px 0;
-        margin: 0;
-    }
-    #header nav:hover ul {
         display: block;
+        float: left;
+        width: 50%;
+        text-align: center;
+    }
+    #header nav li a {
+        display: block;
+        margin: 0;
+        padding: 10px 0;
+    }
+    #footer {
+        margin-top: 40px;
+        padding: 30px 0;
     }
 }