From 9e6015c04f3b6468eadd0881dc99925d701f6c0c Mon Sep 17 00:00:00 2001
From: lauvrenn <lauvrenn@gmail.com>
Date: Sun, 13 Oct 2019 12:33:26 +0200
Subject: [PATCH] Fixes #620: changed nav btn colors to match mockup

---
 src/pages/common/Login/Login.tsx |  3 ++-
 src/themes/styled.theme.tsx      | 20 ++++++++++++++++++++
 2 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/src/pages/common/Login/Login.tsx b/src/pages/common/Login/Login.tsx
index 1f7aeb3ac9..53f733c626 100644
--- a/src/pages/common/Login/Login.tsx
+++ b/src/pages/common/Login/Login.tsx
@@ -98,6 +98,7 @@ export class LoginComponent extends React.Component<IProps, IState> {
             small
             mr={2}
             data-cy="sign-in-button"
+            style={{ fontWeight: 'bold' }}
           >
             Login
           </ButtonSign>
@@ -105,7 +106,7 @@ export class LoginComponent extends React.Component<IProps, IState> {
         <Link to={'/sign-up'}>
           <ButtonSign
             display={['none', 'none', 'flex']}
-            variant="secondary"
+            variant="colorful"
             small
             // onClick={this.toggleModal}
           >
diff --git a/src/themes/styled.theme.tsx b/src/themes/styled.theme.tsx
index 8ffabb47b7..1182a218c1 100644
--- a/src/themes/styled.theme.tsx
+++ b/src/themes/styled.theme.tsx
@@ -143,6 +143,26 @@ const buttons = {
     color: '#e0e0e0',
     backgroundColor: 'transparent',
   },
+  colorful: {
+    fontFamily: '"Varela Round", Arial, sans-serif',
+    border: '2px solid ' + colors.black,
+    color: colors.black,
+    display: 'flex',
+    bg: colors.white,
+    transition: '.2s ease-in-out',
+    '&:hover': {
+      bg: colors.yellow.base,
+      cursor: 'pointer',
+    },
+    '&[disabled]': {
+      opacity: 0.5,
+      cursor: 'not-allowed',
+    },
+    '&[disabled]:hover': {
+      bg: colors.yellow.base,
+    },
+    borderRadius: radii[1] + 'px',
+  },
 }
 
 export default {