From 89def6875681abfe41164abc20cc1d12292dc707 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9=20Neves?= <andrerfneves@protonmail.com>
Date: Sun, 20 Jan 2019 13:57:27 -0500
Subject: [PATCH] refactor: sidebar changes for higher contrast

---
 app/components/sidebar.js | 6 +++---
 app/theme.js              | 9 +++++----
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/app/components/sidebar.js b/app/components/sidebar.js
index f36798b..a0fc896 100644
--- a/app/components/sidebar.js
+++ b/app/components/sidebar.js
@@ -43,7 +43,7 @@ const StyledLink = styled(Link)`
     color: ${/* eslint-disable-next-line max-len */
   props => (props.isActive
     ? props.theme.colors.sidebarItemActive
-    : props.theme.colors.sidebarHoveredItemLabel)};
+    : '#ddd')}
     background-color: ${props => props.theme.colors.sidebarHoveredItem};
   }
 `;
@@ -54,7 +54,7 @@ const Icon = styled.img`
   margin-right: 13px;
 
   ${StyledLink}:hover & {
-    filter: ${props => (props.isActive ? 'none' : 'brightness(200%)')};
+    filter: ${props => (props.isActive ? 'none' : 'brightness(300%)')};
   }
 `;
 
@@ -83,7 +83,7 @@ export const SidebarComponent = ({ options, location }: Props) => (
           <Icon
             isActive={isActive}
             src={item.icon(isActive)}
-            alt={`Sidebar Icon ${item.route}`}
+            alt={`${item.route}`}
           />
           {item.label}
         </StyledLink>
diff --git a/app/theme.js b/app/theme.js
index 867aa8e..3598acb 100644
--- a/app/theme.js
+++ b/app/theme.js
@@ -10,14 +10,15 @@ import { DARK } from './constants/themes';
 const darkOne = '#F4B728';
 const lightOne = '#ffffff';
 const brandOne = '#000';
-const brandTwo = '#3B3B3F';
+// const brandTwo = '#3B3B3F';
+const brandThree = '#5d5d65';
 const activeItem = '#F4B728';
 const text = '#FFF';
 const cardBackgroundColor = '#000';
 const sidebarLogoGradientBegin = '#F4B728';
 const sidebarLogoGradientEnd = '#FFE240';
 const sidebarHoveredItem = '#1C1C1C';
-const sidebarHoveredItemLabel = '#76767e';
+const sidebarHoveredItemLabel = '#8e8e96';
 const background = '#212124';
 const transactionSent = '#FF6C6C';
 const transactionReceived = '#6AEAC0';
@@ -51,14 +52,14 @@ const appTheme = {
       dark: lightOne,
     }),
     sidebarBg: brandOne,
-    sidebarItem: brandTwo,
+    sidebarItem: brandThree,
     sidebarItemActive: activeItem,
     sidebarHoveredItem,
     sidebarHoveredItemLabel,
     cardBackgroundColor,
     text,
     activeItem,
-    inactiveItem: brandTwo,
+    inactiveItem: brandThree,
     sidebarLogoGradientBegin,
     sidebarLogoGradientEnd,
     background,