simplify header on mobile

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>

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),
             },

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);
 }