From 1aee5fe0fb235deb83209c1b81ba57fd8d75a822 Mon Sep 17 00:00:00 2001
From: Kyle Alwyn <kjalwyn@gmail.com>
Date: Tue, 17 Sep 2019 23:47:27 -0700
Subject: [PATCH] fix(Label): Apply correct colors given active state

---
 src/Form/Input.js |  1 -
 src/Form/Label.js | 14 ++++----------
 2 files changed, 4 insertions(+), 11 deletions(-)

diff --git a/src/Form/Input.js b/src/Form/Input.js
index 543d0b8..2ee8708 100644
--- a/src/Form/Input.js
+++ b/src/Form/Input.js
@@ -12,7 +12,6 @@ const InputContainer = createComponent({
   name: 'InputContainer',
   style: css`
     position: relative;
-    color: ${p => p.theme.colors.greyDarker};
 
     & + ${StyledFormError} {
       margin-left: 4px;
diff --git a/src/Form/Label.js b/src/Form/Label.js
index f81dacd..d36f43c 100644
--- a/src/Form/Label.js
+++ b/src/Form/Label.js
@@ -14,23 +14,17 @@ const Label = createComponent({
       css`
         position: absolute;
         margin: 0;
-        font-size: 16px;
         line-height: 14px;
         left: 9px;
-        top: 50%;
-        transform: translateY(-50%);
+        font-size: ${isFloating ? 12 : 16}px;
+        top: ${isFloating ? '6px' : '50%'};
+        transform: ${isFloating ? 'none' : 'translateY(-50%)'};
+        color: ${theme.colors.greyDarker};
         user-select: none;
 
         &:hover {
           cursor: text;
         }
-
-        ${isFloating &&
-          css`
-            font-size: 12px;
-            top: 6px;
-            transform: none;
-          `}
       `};
 
     ${isFocused &&