From d3f6bcb6b265cf37fcbec3f9d8653da9a397e572 Mon Sep 17 00:00:00 2001
From: Alison Joseph <alisonejoseph@gmail.com>
Date: Mon, 7 May 2018 11:20:22 -0500
Subject: [PATCH] feat(Skeleton-states): Add skeleton state styles (#713)

* feat(skeleton): Add skeleton loading mixin and styles

* feat(skeleton): Add skeleton icon styles

* feat(skeleton): Add skeleton styles to components

* feat(skeleton): Add structured list skeleton

* feat: skeleton styles

* feat: add skeleton demo html

* feat: update skeleton html

* feat(skeleton-states): Update accordion skeleton styles

* feat(skeleton-states): Update accordion

* chore: Update px to rem

* chore: remove duplicate code

* chore: Add correct color value for skeleton state

* feat(skeleton-states): Update data table
---
 src/components/text-area/_text-area.scss   | 10 ++++++++++
 src/components/text-input/_text-input.scss | 10 ++++++++++
 2 files changed, 20 insertions(+)

diff --git a/src/components/text-area/_text-area.scss b/src/components/text-area/_text-area.scss
index 4683f0b66dcb..8c0abf44e462 100644
--- a/src/components/text-area/_text-area.scss
+++ b/src/components/text-area/_text-area.scss
@@ -96,4 +96,14 @@
       color: transparent;
     }
   }
+
+  // Skeleton State
+  #{$prefix}--text-area.#{$prefix}--skeleton {
+    @include skeleton;
+    height: rem(100px);
+
+    &::-webkit-input-placeholder {
+      color: transparent;
+    }
+  }
 }
diff --git a/src/components/text-input/_text-input.scss b/src/components/text-input/_text-input.scss
index 8d3f9deb3977..cf90c9a62629 100644
--- a/src/components/text-input/_text-input.scss
+++ b/src/components/text-input/_text-input.scss
@@ -97,4 +97,14 @@
       color: transparent;
     }
   }
+
+  // Skeleton State
+  .#{$prefix}--text-input.#{$prefix}--skeleton {
+    @include skeleton;
+    width: 100%;
+
+    &::-webkit-input-placeholder {
+      color: transparent;
+    }
+  }
 }