From c7d47dcd0acd67a3c6c2c7e0b51b2347c8b67135 Mon Sep 17 00:00:00 2001
From: pittaxx <pittaxx@gmail.com>
Date: Sat, 26 Dec 2015 21:37:42 +0200
Subject: [PATCH] Fixed css bug, where both min-width and max-width were set to
 768. Max-width was changed to 767 to prevent overlap, which produces
 artifacts when screen width is exactly 768 pixels.

---
 website/public/css/global-modules.styl |  6 +++---
 website/public/css/header.styl         |  6 +++---
 website/public/css/menu.styl           | 10 +++++-----
 website/public/css/npcs.styl           |  2 +-
 website/public/css/options.styl        |  8 ++++----
 website/public/css/shared.styl         |  2 +-
 6 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/website/public/css/global-modules.styl b/website/public/css/global-modules.styl
index 1c05319fbc..4e3866c31a 100644
--- a/website/public/css/global-modules.styl
+++ b/website/public/css/global-modules.styl
@@ -221,7 +221,7 @@ $hrpg-modal-dropdown
     min-width:110px
     border-radius:4px
     background-color:#fff
-    @media screen and (max-width:768px)
+    @media screen and (max-width:767px)
       position:fixed
       z-index: 1000
       top: 2%
@@ -254,7 +254,7 @@ $hrpg-modal-dropdown
         max-height: 62.8vh
       li
         width: 100%
-        @media screen and (max-width:768px)
+        @media screen and (max-width:767px)
           width: auto
       a
         display: inline-block
@@ -297,7 +297,7 @@ $hrpg-modal-controls
     margin-right: 0.618em
     margin-bottom: 0.382em
     display: inline-block
-  @media screen and (max-width:768px)
+  @media screen and (max-width:767px)
     width: 96%
     position: fixed
     bottom:2%
diff --git a/website/public/css/header.styl b/website/public/css/header.styl
index ce22d3945d..6dcf488caf 100644
--- a/website/public/css/header.styl
+++ b/website/public/css/header.styl
@@ -10,7 +10,7 @@
   overflow-y: hidden
   overflow-x: auto
   // position relative
-  @media screen and (max-width:768px)  // remove padding-top when toolbar is static
+  @media screen and (max-width:767px)  // remove padding-top when toolbar is static
     padding: 0
 .toolbar.active ~ .header-wrap
   padding: 0 // remove padding when toolbar is hidden
@@ -107,7 +107,7 @@
   vertical-align: middle
   min-width:175px
   width: 75%
-  @media screen and (max-width:768px)
+  @media screen and (max-width:767px)
     padding: 1.1em 0.618em 0
   .meter-label
     float: left
@@ -169,4 +169,4 @@ header .hero-stats
 
 button.party-invite
   display: block
-  margin: 57px auto
\ No newline at end of file
+  margin: 57px auto
diff --git a/website/public/css/menu.styl b/website/public/css/menu.styl
index e9700a2a42..183c0efe8f 100644
--- a/website/public/css/menu.styl
+++ b/website/public/css/menu.styl
@@ -77,7 +77,7 @@
   white-space: nowrap
   float:left;
   padding: 0.618em
-  @media screen and (max-width:768px)
+  @media screen and (max-width:767px)
     display: none
   > li
     margin-right: 0.618em
@@ -98,7 +98,7 @@
 .toolbar-bailey, .toolbar-wallet, .toolbar-options, .toolbar-subscribe
   float:right
   padding: 0.618em 0.618em 0.618em 0
-  @media screen and (max-width:768px)
+  @media screen and (max-width:767px)
     float: none
     display: inline-block
     padding: 0.618em 0.382em 0.618em 0
@@ -121,7 +121,7 @@
 .toolbar-options, .toolbar-wallet
   > li
     margin-left: 0.618em
-@media screen and (max-width:768px)
+@media screen and (max-width:767px)
   .toolbar-options
     > li
       padding-left:0em
@@ -140,7 +140,7 @@
   div
     padding-bottom: 1em
     width: 300px
-    @media screen and (max-width:768px)
+    @media screen and (max-width:767px)
       width: 96%
     .toolbar-notifs-notifs
       padding-bottom:1em
@@ -167,7 +167,7 @@
     hrpg-button-color-mixin(lighten($color-toolbar,32.8%))
 .toolbar-subscribe-button, .toolbar-controls .toolbar-subscribe-button
   @extend $hrpg-button
-@media screen and (max-width:768px)
+@media screen and (max-width:767px)
   .toolbar-toggle
     display: none
   .toolbar-mobile, .toolbar-settings, .toolbar-audio
diff --git a/website/public/css/npcs.styl b/website/public/css/npcs.styl
index 7acf652045..b33e5e65f7 100644
--- a/website/public/css/npcs.styl
+++ b/website/public/css/npcs.styl
@@ -8,7 +8,7 @@
   width:55px
   margin-right:0.618em
   position:relative
-  @media screen and (max-width:768px)
+  @media screen and (max-width:767px)
     margin-right:0px
 .npc_bailey
   float:left
diff --git a/website/public/css/options.styl b/website/public/css/options.styl
index 1b4eb3b4a0..2cb964d09b 100644
--- a/website/public/css/options.styl
+++ b/website/public/css/options.styl
@@ -12,7 +12,7 @@
 
   li
     @extend $hrpg-button
-    hrpg-button-color-mixin($color-options-menu)  
+    hrpg-button-color-mixin($color-options-menu)
 
 .options-submenu
   margin-top: -1.618em
@@ -27,9 +27,9 @@
   border-bottom: 1px solid darken($color-options-menu, 12%)
   padding: .5em
 
-  @media screen and (max-width:768px)
+  @media screen and (max-width:767px)
     padding: 1em 0.618em 0 0.618em
     border: 1px solid darken($color-options-menu, 12%)
     border-top: none
-    
-  
+
+
diff --git a/website/public/css/shared.styl b/website/public/css/shared.styl
index 894d2ca7a8..a4ba105d98 100644
--- a/website/public/css/shared.styl
+++ b/website/public/css/shared.styl
@@ -53,7 +53,7 @@ li.spaced
     color: white;
     margin-right: 5px;
 
-@media (max-width: 768px)
+@media (max-width:767px)
   .container-fluid
     padding-right: 5px
     padding-left: 5px