From 25172c5f1564fa692d6a4f28d5462e9a0a29364f Mon Sep 17 00:00:00 2001
From: Jake Richan <jake.richan@gmail.com>
Date: Mon, 27 Nov 2017 15:58:49 -0700
Subject: [PATCH] update defaults in input component config.css Use color-text
 variable for label and border color. This seems like an intuitive default
 since the default background is transparent. Also, the input element needs
 the option to set a custom color value, otherwise setting a custom background
 is limited to what works with the overall text-color.

---
 components/input/config.css | 5 +++--
 components/input/theme.css  | 2 +-
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/components/input/config.css b/components/input/config.css
index 58e389e5..5916deef 100644
--- a/components/input/config.css
+++ b/components/input/config.css
@@ -6,8 +6,9 @@
   --input-label-font-size: calc(1.2 * var(--unit));
   --input-focus-label-top: calc(0.6 * var(--unit));
   --input-text-background-color: transparent;
-  --input-text-label-color: color(var(--color-black) a(26%));
-  --input-text-bottom-border-color: color(var(--color-black) a(12%));
+  --input-text-label-color: color(var(--color-text) a(26%));
+  --input-text-input-element-color: var(--color-text);
+  --input-text-bottom-border-color: color(var(--color-text) a(12%));
   --input-text-highlight-color: var(--color-primary);
   --input-text-disabled-color: var(--input-text-bottom-border-color);
   --input-text-disabled-text-color: var(--input-text-label-color);
diff --git a/components/input/theme.css b/components/input/theme.css
index a39cb874..e216bb5a 100644
--- a/components/input/theme.css
+++ b/components/input/theme.css
@@ -34,7 +34,7 @@
   border-radius: 0;
   border-right: 0;
   border-top: 0;
-  color: var(--color-text);
+  color: var(--input-text-input-element-color);
   display: block;
   font-size: var(--input-field-font-size);
   outline: none;