From 3e9f9efd383810d5fcb883e33915a1238048e090 Mon Sep 17 00:00:00 2001
From: Caroline Horn <549577+cchaos@users.noreply.github.com>
Date: Fri, 12 Jul 2019 12:14:55 -0400
Subject: [PATCH] [Feature branch] Updated form control border color (#2114)

* Updated form control border color

* Slighly more transparent

* change sass var name to $euiFormBorderOpaqueColor
---
 src/components/form/_mixins.scss    | 4 ++--
 src/components/form/_variables.scss | 5 +++--
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/components/form/_mixins.scss b/src/components/form/_mixins.scss
index b9d85ca47e4..be0bc3ba6ce 100644
--- a/src/components/form/_mixins.scss
+++ b/src/components/form/_mixins.scss
@@ -122,12 +122,12 @@
   background-size: 100% 100%; /* 3 */
 
   @if ($borderOnly) {
-    box-shadow: inset 0 0 0 1px transparentize($euiColorFullShade, .84);
+    box-shadow: inset 0 0 0 1px $euiFormBorderColor;
   } @else {
     box-shadow:
       0 1px 1px -1px transparentize($euiShadowColor, .8),
       0 4px 4px -2px transparentize($euiShadowColor, .8),
-      inset 0 0 0 1px transparentize($euiColorFullShade, .84);
+      inset 0 0 0 1px $euiFormBorderColor;
   }
 }
 
diff --git a/src/components/form/_variables.scss b/src/components/form/_variables.scss
index eae29dabd11..e42d4f02023 100644
--- a/src/components/form/_variables.scss
+++ b/src/components/form/_variables.scss
@@ -16,8 +16,9 @@ $euiSwitchIconHeight: $euiSize !default;
 // Coloring
 $euiFormBackgroundColor: tintOrShade($euiColorLightestShade, 60%, 40%) !default;
 $euiFormBackgroundDisabledColor: darken($euiColorLightestShade, 2%) !default;
-$euiFormBorderColor: transparentize($euiColorFullShade, .9) !default;
-$euiFormBorderDisabledColor: transparentize($euiColorFullShade, .92) !default;
+$euiFormBorderOpaqueColor: shade(desaturate(adjust-hue($euiColorPrimary, 22), 22.95), 26%) !default;
+$euiFormBorderColor: transparentize($euiFormBorderOpaqueColor, .9) !default;
+$euiFormBorderDisabledColor: transparentize($euiFormBorderOpaqueColor, .9) !default;
 $euiFormCustomControlDisabledIconColor: shadeOrTint($euiColorMediumShade, 38%, 48.5%) !default; // exact 508c foreground for $euiColorLightShade
 $euiFormControlDisabledColor: $euiColorMediumShade !default;
 $euiFormControlBoxShadow: 0 1px 1px -1px transparentize($euiShadowColor, .8), 0 3px 2px -2px transparentize($euiShadowColor, .8);