From f194845b2b9a5988b9ed0192b62595d05bedc1c1 Mon Sep 17 00:00:00 2001
From: Vignesh Mohankumar <vignesh@vigneshmohankumar.com>
Date: Wed, 31 Aug 2022 20:13:21 -0400
Subject: [PATCH] chore: remove theme.blue200 (#4533)

* chore: remove theme.blue200

* favorite button changes
---
 src/components/Tokens/TokenTable/FavoriteButton.tsx | 10 +++++++---
 src/components/Tokens/TokenTable/NetworkFilter.tsx  |  4 ++--
 src/components/Tokens/TokenTable/TimeSelector.tsx   |  4 ++--
 src/theme/index.tsx                                 |  1 -
 src/theme/styled.d.ts                               |  1 -
 5 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/src/components/Tokens/TokenTable/FavoriteButton.tsx b/src/components/Tokens/TokenTable/FavoriteButton.tsx
index 0459a843ce..d236bfbe41 100644
--- a/src/components/Tokens/TokenTable/FavoriteButton.tsx
+++ b/src/components/Tokens/TokenTable/FavoriteButton.tsx
@@ -15,9 +15,9 @@ const FavoriteButtonContent = styled.div`
 const StyledFavoriteButton = styled.button<{ active: boolean }>`
   padding: 0px 16px;
   border-radius: 12px;
-  background-color: ${({ theme, active }) => (active ? theme.accentAction : theme.backgroundInteractive)};
+  background-color: ${({ theme, active }) => (active ? theme.accentActiveSoft : theme.backgroundInteractive)};
   border: none;
-  color: ${({ theme, active }) => (active ? theme.white : theme.textPrimary)};
+  color: ${({ theme, active }) => (active ? theme.accentActive : theme.textPrimary)};
   font-size: 16px;
   font-weight: 600;
   cursor: pointer;
@@ -38,7 +38,11 @@ export default function FavoriteButton() {
   return (
     <StyledFavoriteButton onClick={() => setShowFavorites(!showFavorites)} active={showFavorites}>
       <FavoriteButtonContent>
-        <Heart size={17} color={showFavorites ? theme.white : theme.textPrimary} fill="transparent" />
+        <Heart
+          size={17}
+          color={showFavorites ? theme.accentActive : theme.textPrimary}
+          fill={showFavorites ? theme.accentActive : 'transparent'}
+        />
         <FavoriteText>
           <Trans>Favorites</Trans>
         </FavoriteText>
diff --git a/src/components/Tokens/TokenTable/NetworkFilter.tsx b/src/components/Tokens/TokenTable/NetworkFilter.tsx
index 65d9a655f9..ad51a076ed 100644
--- a/src/components/Tokens/TokenTable/NetworkFilter.tsx
+++ b/src/components/Tokens/TokenTable/NetworkFilter.tsx
@@ -63,7 +63,7 @@ const MenuTimeFlyout = styled.span`
 const StyledMenuButton = styled.button<{ open: boolean }>`
   width: 100%;
   height: 100%;
-  color: ${({ theme, open }) => (open ? theme.blue200 : theme.textPrimary)};
+  color: ${({ theme, open }) => (open ? theme.accentActive : theme.textPrimary)};
   border: none;
   background-color: ${({ theme, open }) => (open ? theme.accentActiveSoft : theme.backgroundInteractive)};
   margin: 0;
@@ -115,7 +115,7 @@ const StyledMenuContent = styled.div`
 
 const Chevron = styled.span<{ open: boolean }>`
   padding-top: 1px;
-  color: ${({ open, theme }) => (open ? theme.blue200 : theme.textSecondary)};
+  color: ${({ open, theme }) => (open ? theme.accentActive : theme.textSecondary)};
 `
 const NetworkLabel = styled.div`
   display: flex;
diff --git a/src/components/Tokens/TokenTable/TimeSelector.tsx b/src/components/Tokens/TokenTable/TimeSelector.tsx
index 9113fe0be8..ccf5e2005b 100644
--- a/src/components/Tokens/TokenTable/TimeSelector.tsx
+++ b/src/components/Tokens/TokenTable/TimeSelector.tsx
@@ -81,7 +81,7 @@ const StyledMenuButton = styled.button<{ open: boolean }>`
   width: 100%;
   height: 100%;
   border: none;
-  color: ${({ theme, open }) => (open ? theme.blue200 : theme.textPrimary)};
+  color: ${({ theme, open }) => (open ? theme.accentActive : theme.textPrimary)};
   margin: 0;
   background-color: ${({ theme, open }) => (open ? theme.accentActiveSoft : theme.backgroundInteractive)};
   padding: 6px 12px 6px 12px;
@@ -131,7 +131,7 @@ const StyledMenuContent = styled.div`
 
 const Chevron = styled.span<{ open: boolean }>`
   padding-top: 1px;
-  color: ${({ open, theme }) => (open ? theme.blue200 : theme.textSecondary)};
+  color: ${({ open, theme }) => (open ? theme.accentActive : theme.textSecondary)};
 `
 
 // TODO: change this to reflect data pipeline
diff --git a/src/theme/index.tsx b/src/theme/index.tsx
index 0f3fc56db6..fc22fb450d 100644
--- a/src/theme/index.tsx
+++ b/src/theme/index.tsx
@@ -131,7 +131,6 @@ function uniswapThemeColors(darkMode: boolean): ThemeColors {
     chain_421611: colorsDark.chain_421611,
     chain_80001: colorsDark.chain_80001,
 
-    blue200: ColorsPalette.blue200,
     shallowShadow: darkMode ? colorsDark.shallowShadow : colorsLight.shallowShadow,
     deepShadow: darkMode ? colorsDark.deepShadow : colorsLight.deepShadow,
     hoverState: opacify(24, ColorsPalette.blue200),
diff --git a/src/theme/styled.d.ts b/src/theme/styled.d.ts
index c67be6b0d2..49e6b78b50 100644
--- a/src/theme/styled.d.ts
+++ b/src/theme/styled.d.ts
@@ -53,7 +53,6 @@ export interface ThemeColors {
   chain_421611: Color
   chain_80001: Color
 
-  blue200: Color
   shallowShadow: Color
   deepShadow: Color
   hoverState: Color