From bb6a7aff2380af41ed777bbd8fec6f6823b2364f Mon Sep 17 00:00:00 2001
From: Alex Windett <windettalex@gmail.com>
Date: Fri, 3 Feb 2017 15:09:14 +0000
Subject: [PATCH] correcting metric colors

---
 ui/src/components/metric/close-button.js    | 5 ++---
 ui/src/components/metric/graph.js           | 2 +-
 ui/src/components/metric/select.js          | 6 +++---
 ui/src/components/metric/settings-button.js | 4 ++--
 ui/src/components/metric/title.js           | 2 +-
 5 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/ui/src/components/metric/close-button.js b/ui/src/components/metric/close-button.js
index 28289358..435b222c 100644
--- a/ui/src/components/metric/close-button.js
+++ b/ui/src/components/metric/close-button.js
@@ -24,9 +24,8 @@ const StyledButton = styled.button`
   display: flex;
   margin: 0;
   padding: ${remcalc(18)} ${remcalc(24)};
-  color: ${colors.base.primary};
   float: right;
-  background-color: ${colors.base.primaryLight};
+  background-color: ${colors.base.primaryDark};
   line-height: 1.5;
   border: none;
   border-left: solid ${remcalc(1)} ${colors.base.primaryDark};
@@ -34,7 +33,7 @@ const StyledButton = styled.button`
 `;
 
 const StyledIcon = styled(CloseIcon)`
-  fill: ${colors.base.primary};
+  fill: ${colors.base.white};
 `;
 
 const AddMetricButton = ({
diff --git a/ui/src/components/metric/graph.js b/ui/src/components/metric/graph.js
index 229859d2..35a80a76 100644
--- a/ui/src/components/metric/graph.js
+++ b/ui/src/components/metric/graph.js
@@ -19,7 +19,7 @@ const Container = styled.div`
   position: relative;
   height: 100%;
   width: 100%;
-  background-color: ${colors.base.primary};
+  background-color: ${colors.base.white};
 `;
 
 const Canvas = styled.canvas`
diff --git a/ui/src/components/metric/select.js b/ui/src/components/metric/select.js
index 8a01a1a8..0a891a38 100644
--- a/ui/src/components/metric/select.js
+++ b/ui/src/components/metric/select.js
@@ -29,7 +29,7 @@ const SelectWrapper = styled.div`
   &:after {
     border-left: 5px solid transparent;
     border-right: 5px solid transparent;
-    border-top: 5px solid ${colors.base.primary};
+    border-top: 5px solid ${colors.base.white};
 
     ${pseudoEl({
       top: '28px',
@@ -44,8 +44,8 @@ const StyledSelect = styled.select`
   font-size:16px;
   text-align: right !important;
   border-radius: 0;
-  color: ${colors.base.primary};
-  background-color: ${colors.base.primaryLight};
+  color: ${colors.base.white};
+  background-color: ${colors.base.primaryDark};
   border: none;
   border-left: solid ${remcalc(1)} ${colors.base.primaryDark};
   -webkit-appearance: none;
diff --git a/ui/src/components/metric/settings-button.js b/ui/src/components/metric/settings-button.js
index 586ece9e..5768a5b8 100644
--- a/ui/src/components/metric/settings-button.js
+++ b/ui/src/components/metric/settings-button.js
@@ -25,9 +25,9 @@ const StyledButton = styled(Button)`
   display: flex;
   margin: 0;
   padding: ${remcalc(18)} ${remcalc(24)};
-  color: ${colors.base.primary};
+  color: ${colors.base.white};
   float: right;
-  background-color: ${colors.base.primaryLight};
+  background-color: ${colors.base.primaryDark};
   line-height: 1.5;
   border: none;
   border-left: solid ${remcalc(1)} ${colors.base.primaryDark};
diff --git a/ui/src/components/metric/title.js b/ui/src/components/metric/title.js
index 20e9e693..180b4ad5 100644
--- a/ui/src/components/metric/title.js
+++ b/ui/src/components/metric/title.js
@@ -23,5 +23,5 @@ module.exports = styled.h3`
   font-weight: normal;
   font-style: normal;
   line-height: 1.5;
-  color: ${colors.base.primary};
+  color: ${colors.base.white};
 `;