From 403c86e4d1b0067634d1f0f6bd3d6908f8b4481b Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 5 Dec 2018 15:01:56 +0300
Subject: back button for mobile

---
 src/App.scss | 48 ++++++++++++++++++++++++++++++++++--------------
 1 file changed, 34 insertions(+), 14 deletions(-)

(limited to 'src/App.scss')

diff --git a/src/App.scss b/src/App.scss
index 056a235e..fcab3b1c 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -206,24 +206,23 @@ i[class*=icon-] {
   padding: 0 10px 0 10px;
 }
 
-.gaps {
-  margin: -1em 0 0 -1em;
-}
-
 .item {
   flex: 1;
   line-height: 50px;
   height: 50px;
   overflow: hidden;
+  display: flex;
+  flex-wrap: wrap;
 
   .nav-icon {
     font-size: 1.1em;
     margin-left: 0.4em;
   }
-}
 
-.gaps > .item {
-  padding: 1em 0 0 1em;
+  &.right {
+    justify-content: right;
+    padding-right: 20px;
+  }
 }
 
 .auto-size {
@@ -271,8 +270,6 @@ nav {
   }
 
   .inner-nav {
-    padding-left: 20px;
-    padding-right: 20px;
     display: flex;
     align-items: center;
     flex-basis: 970px;
@@ -392,6 +389,23 @@ nav {
   color: $fallback--faint;
   color: var(--faint, $fallback--faint);
   box-shadow: 0px 0px 4px rgba(0,0,0,.6);
+
+  .back-button {
+    display: block;
+    max-width: 99px;
+    transition-property: opacity, max-width;
+    transition-duration: 300ms;
+    transition-timing-function: ease-out;
+
+    i {
+      margin: 0 1em;
+    }
+
+    &.hidden {
+      opacity: 0;
+      max-width: 20px;
+    }
+  }
 }
 
 .fade-enter-active, .fade-leave-active {
@@ -426,6 +440,7 @@ nav {
   display: none;
   width: 100%;
   height: 46px;
+
   button {
     display: block;
     flex: 1;
@@ -439,6 +454,16 @@ nav {
   body {
     overflow-y: scroll;
   }
+
+  nav {
+    .back-button {
+      display: none;
+    }
+    .site-name {
+      padding-left: 20px;
+    }
+  }
+
   .sidebar-bounds {
     overflow: hidden;
     max-height: 100vh;
@@ -505,11 +530,6 @@ nav {
   }
 }
 
-.item.right {
-  text-align: right;
-  padding-right: 20px;
-}
-
 .visibility-tray {
   font-size: 1.2em;
   padding: 3px;
-- 
cgit v1.2.3-70-g09d2


From ac80cf868ff30fc4e61862d43666188ddb87b5dd Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Fri, 14 Dec 2018 14:35:56 +0300
Subject: fix chrome

---
 src/App.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/App.scss')

diff --git a/src/App.scss b/src/App.scss
index 871f193f..0a303b15 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -242,7 +242,7 @@ i[class*=icon-] {
   }
 
   &.right {
-    justify-content: right;
+    justify-content: flex-end;
     padding-right: 20px;
   }
 }
-- 
cgit v1.2.3-70-g09d2