From 0d3bafde1e54b6851b40a83fb1c1caed90292542 Mon Sep 17 00:00:00 2001
From: Paul Adam Davis <pauladamdavis@gmail.com>
Date: Mon, 2 Mar 2015 14:00:20 +0000
Subject: [PATCH] Fix menu button overflow

References #180

- Adds `overflow-x: hidden` to `.site-wrapper` when navigation is open to prevent the menu button flowing into the navigation & covering the 'Menu' title text in Firefox.
---
 assets/css/screen.css | 15 ++++++++-------
 1 file changed, 8 insertions(+), 7 deletions(-)

diff --git a/assets/css/screen.css b/assets/css/screen.css
index da59180..579f491 100644
--- a/assets/css/screen.css
+++ b/assets/css/screen.css
@@ -476,6 +476,7 @@ margin on the iframe, cause it breaks stuff. */
 }
 
 body.nav-opened .site-wrapper {
+    overflow-x: hidden;
     -webkit-transform: translate3D(-240px, 0, 0);
         -ms-transform: translate3D(-240px, 0, 0);
             transform: translate3D(-240px, 0, 0);
@@ -529,7 +530,7 @@ body.nav-opened .nav-cover {
     top: 0;
     right: 0;
     bottom: 0;
-    z-index: 50;
+    z-index: 5;
     width: 240px;
     opacity: 0;
     background: #111;
@@ -1052,8 +1053,8 @@ body:not(.post-template) .post-title {
     border: none;
 }
 
-/* Stop elements, such as img wider than the post content, from 
-   creating horizontal scroll - slight hack due to imperfections 
+/* Stop elements, such as img wider than the post content, from
+   creating horizontal scroll - slight hack due to imperfections
    with browser width % calculations and rounding */
 .post-template .content {
     overflow: hidden;
@@ -1071,16 +1072,16 @@ body:not(.post-template) .post-title {
     display: none;
 }
 
-/* Keep images centered, and allow images wider than the main 
+/* Keep images centered, and allow images wider than the main
    text column to break out. */
 .post-content img {
     display: block;
     max-width: 126%;
     height: auto;
     padding: 0.6em 0;
-    /* Centers an image by (1) pushing its left edge to the 
-       center of its container and (2) shifting the entire image 
-       in the opposite direction by half its own width. 
+    /* Centers an image by (1) pushing its left edge to the
+       center of its container and (2) shifting the entire image
+       in the opposite direction by half its own width.
        Works for images that are larger than their containers. */
     position: relative;
     left: 50%;