From 641082f7653be6281b7452046168283e7367371f Mon Sep 17 00:00:00 2001
From: Kata <git@kat.cafe>
Date: Tue, 19 Mar 2019 21:24:30 -0500
Subject: [PATCH] header/unauth: add login button

---
 ui/components/header/unauth.js | 27 ++++++++++++++++++++++++++-
 1 file changed, 26 insertions(+), 1 deletion(-)

diff --git a/ui/components/header/unauth.js b/ui/components/header/unauth.js
index 086faa7..9aa226f 100644
--- a/ui/components/header/unauth.js
+++ b/ui/components/header/unauth.js
@@ -12,6 +12,29 @@ const LogoBox = styled.a`
   cursor: pointer;
 `
 
+const LoginButton = styled.a`
+  cursor: pointer;
+  background-color: transparent;
+  display: block;
+  padding: 0.3em 1em;
+  border-radius: 2px;
+  border: 1px solid transparent;
+  transition: all 0.3s ease-in-out;
+
+  &:hover {
+    transform: translateY(-1px);
+    box-shadow: 0 1px 2px rgba(0,0,0,0.75);
+    background-color: var(--c-green);
+    border-color: rgba(0,0,0,0.25);
+    text-shadow: 1px 1px 0px rgba(0,0,0,0.25);
+  }
+
+  &:active {
+    transform: translateY(0px);
+    box-shadow: none;
+  }
+`
+
 const HeaderBarUnauth: React.StatelessFunctionalComponent<CommonProps> = (props) => (
   <HeaderBarCommon {...props}>
     <>
@@ -20,7 +43,9 @@ const HeaderBarUnauth: React.StatelessFunctionalComponent<CommonProps> = (props)
           <Logotype />
         </LogoBox>
       </Link>
-      Hey stranger.
+      <Link href='/auth/login' prefetch>
+        <LoginButton>Sign in →</LoginButton>
+      </Link>
     </>
   </HeaderBarCommon>
 )