From 15dc05fffc24c52d3ca6502232f4321b4ba9ce8f Mon Sep 17 00:00:00 2001
From: jessop <jessop@lbry.com>
Date: Fri, 28 Feb 2020 00:18:37 -0500
Subject: [PATCH] simplify header on mobile

---
 ui/component/header/view.jsx         | 12 +-----------
 ui/component/sideNavigation/view.jsx |  3 +++
 ui/scss/component/_header.scss       |  8 ++++++++
 3 files changed, 12 insertions(+), 11 deletions(-)

diff --git a/ui/component/header/view.jsx b/ui/component/header/view.jsx
index ecba00685..c8b427a0f 100644
--- a/ui/component/header/view.jsx
+++ b/ui/component/header/view.jsx
@@ -60,7 +60,6 @@ const Header = (props: Props) => {
 
   // on the verify page don't let anyone escape other than by closing the tab to keep session data consistent
   const isVerifyPage = history.location.pathname.includes(PAGES.AUTH_VERIFY);
-  const isAuthPage = history.location.pathname.includes(PAGES.AUTH);
 
   // Sign out if they click the "x" when they are on the password prompt
   const authHeaderAction = syncError ? { onClick: signOut } : { navigate: '/' };
@@ -104,7 +103,7 @@ const Header = (props: Props) => {
       <div className="header__contents">
         <div className="header__navigation">
           <Button
-            className="header__navigation-item header__navigation-item--lbry"
+            className="header__navigation-item header__navigation-item--lbry header__navigation-item--button-mobile"
             label={__('LBRY')}
             icon={ICONS.LBRY}
             onClick={() => window.scrollTo(0, 0)}
@@ -230,15 +229,6 @@ const Header = (props: Props) => {
             </div>
           )
         )}
-
-        {!authenticated && !isAuthPage && (
-          <Button
-            button="primary"
-            label={__('Sign In')}
-            className="header__menu--mobile"
-            onClick={() => history.push(`/$/${PAGES.AUTH}`)}
-          />
-        )}
         <Button onClick={openMobileNavigation} icon={ICONS.MENU} iconSize={24} className="header__menu--mobile" />
       </div>
     </header>
diff --git a/ui/component/sideNavigation/view.jsx b/ui/component/sideNavigation/view.jsx
index c71cbc244..b70f7ee05 100644
--- a/ui/component/sideNavigation/view.jsx
+++ b/ui/component/sideNavigation/view.jsx
@@ -96,6 +96,9 @@ function SideNavigation(props: Props) {
       <nav className="navigation">
         <ul className="navigation-links">
           {[
+            {
+              ...(expanded && !isAuthenticated ? { ...buildLink(PAGES.AUTH, __('Sign In'), ICONS.SIGN_IN) } : {}),
+            },
             {
               ...buildLink(null, __('Home'), ICONS.HOME),
             },
diff --git a/ui/scss/component/_header.scss b/ui/scss/component/_header.scss
index ecc7e36b4..a7c499716 100644
--- a/ui/scss/component/_header.scss
+++ b/ui/scss/component/_header.scss
@@ -144,6 +144,14 @@
   }
 }
 
+.header__navigation-item--button-mobile {
+  @media (max-width: $breakpoint-small) {
+    .button__label {
+      display: none;
+    }
+  }
+}
+
 .header__navigation-item--balance {
   margin: 0 var(--spacing-medium);
 }