From 454d20aab04080321c21ed50a28589b0f81e4b33 Mon Sep 17 00:00:00 2001
From: zPlus <zplus@peers.community>
Date: Sat, 22 Dec 2018 01:12:51 +0100
Subject: [PATCH] Move burger menu to the right.

---
 freepost/static/stylus/freepost.styl | 19 +++++++------------
 freepost/templates/layout.html       | 12 +++++++-----
 2 files changed, 14 insertions(+), 17 deletions(-)

diff --git a/freepost/static/stylus/freepost.styl b/freepost/static/stylus/freepost.styl
index ab93142c..b894a082 100755
--- a/freepost/static/stylus/freepost.styl
+++ b/freepost/static/stylus/freepost.styl
@@ -43,22 +43,17 @@ body
             @media only screen and (max-width: 800px)
                 display grid
                 grid-template-columns auto
-                text-align  center
                 
                 > .title-large
                     display none
                 
                 > .title-small
                     display grid
-                    grid-template-columns max-content auto
-                    text-align  center
-                    
-                    padding-bottom 1rem
+                    grid-template-columns auto max-content
             
             @media only screen and (min-width: 800px)
                 display grid
                 grid-template-columns max-content auto
-                text-align  center
                 
                 > .title-small
                     display none
@@ -73,7 +68,7 @@ body
                 .menu
                     border-bottom  2px dashed #aaa
                     display        none
-                    padding-bottom 1rem
+                    padding        1rem 0
                     
                     /* This class is toggled when the burger icon is clicked */
                     &.visible
@@ -85,22 +80,22 @@ body
                             color           #000
                             display         block
                             margin          0
-                            padding         .5rem
+                            padding         .8rem 0
                             text-align      left
                             text-decoration none
                         
                         /* Highlight menu item of the current active page (Hot/New/Submit/...) */
                         > .active_page
-                            background-color #f8f8f8
-                            border-right     4px solid black
-                            font-weight      bold
+                            font-weight     bold
+                            text-decoration underline dotted
+                            text-transform  uppercase
                         
                         /* Highlight username if there are unread messages */
                         .new_messages
                             background-color  rgb(255, 175, 50)
-                            border-radius     4px
                             color             #fff
                             font-weight       bold
+                            padding-left      1rem
             
             @media only screen and (min-width: 800px)
                 .burger-icon
diff --git a/freepost/templates/layout.html b/freepost/templates/layout.html
index 5775cbb9..9a8e4552 100644
--- a/freepost/templates/layout.html
+++ b/freepost/templates/layout.html
@@ -22,11 +22,7 @@
             <div class="header">
                 
                 <div class="title-small">
-                    <div class="burger-icon {{ 'notify' if unread_messages }}">
-                        <div class="line1"></div>
-                        <div class="line2"></div>
-                        <div class="line3"></div>
-                    </div>
+                    
                     
                     {% if topic %}
                         <a href="{{ url ('topic', name=topic) }}" class="flex-item logo">
@@ -39,6 +35,12 @@
                             post
                         </a>
                     {% endif %}
+                    
+                    <div class="burger-icon {{ 'notify' if unread_messages }}">
+                        <div class="line1"></div>
+                        <div class="line2"></div>
+                        <div class="line3"></div>
+                    </div>
                 </div>
                 
                 <div class="title-large">