update beta badge styles

elastic · Nov 6, 2018 · 1733c4a · 1733c4a
1 parent c6b1a84
commit 1733c4a
Show file tree

Hide file tree

Showing 4 changed files with 5 additions and 6 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,6 +1,6 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
-No public interface changes since `4.8.0`.
+- Added `lab` icon to `EuiIcon` and updated the `EuiBetaBadge` styling ([#1291](https://github.com/elastic/eui/pull/1291/))
 
 ## [`4.8.0`](https://github.com/elastic/eui/tree/v4.8.0)
 

diff --git a/src-docs/src/views/badge/beta_badge.js b/src-docs/src/views/badge/beta_badge.js
@@ -12,7 +12,7 @@ export default () => (
     &emsp;
     <EuiBetaBadge label="Lab" title="Laboratory" tooltipContent="This module is not GA. Please help us by reporting any bugs." />
     &emsp;
-    <EuiBetaBadge label="Lightening" iconType="bolt" />
+    <EuiBetaBadge label="Beaker" iconType="lab" />
 
     <EuiSpacer />
     <EuiTitle>

diff --git a/src/components/badge/beta_badge/_beta_badge.scss b/src/components/badge/beta_badge/_beta_badge.scss
@@ -1,16 +1,14 @@
 .euiBetaBadge {
   display: inline-block;
-  padding: 0 $euiSizeL;
+  padding: 0 $euiSize;
   border-radius: $euiSizeL;
-  background-color: $euiColorAccent;
+  box-shadow: inset 0 0 0 1px $euiBorderColor;
   vertical-align: super; // if displayed inline with text
-  @include euiSlightShadowHover($euiColorAccent);
 
   font-size: $euiFontSizeXS;
   font-weight: $euiFontWeightBold;
   text-transform: uppercase;
   letter-spacing: .05em;
-  color: chooseLightOrDarkText($euiColorAccent, $euiColorEmptyShade, $euiColorFullShade);
   line-height: $euiSizeL;
   text-align: center;
   white-space: nowrap;

diff --git a/src/components/badge/beta_badge/_mixins.scss b/src/components/badge/beta_badge/_mixins.scss
@@ -26,6 +26,7 @@
       .#{$selector}__betaBadge {
         overflow: hidden;
         text-overflow: ellipsis;
+        background-color: $euiColorEmptyShade;
       }
     }
   }