Adds lab icon and updates beta badge style (#1291)

* adds lab icon * update beta badge styles * change name to beaker
elastic · Nov 6, 2018 · f4ea18b · f4ea18b
1 parent 23f3058
commit f4ea18b
Show file tree

Hide file tree

Showing 8 changed files with 12 additions and 5 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,6 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
+- Added `beaker` icon to `EuiIcon` and updated the `EuiBetaBadge` styling ([#1291](https://github.com/elastic/eui/pull/1291/))
 - Removed calls to deprecated `findDOMNode` ([#1285](https://github.com/elastic/eui/pull/1285))
 
 **Breaking changes**

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="Lab" iconType="beaker" />
 
     <EuiSpacer />
     <EuiTitle>

diff --git a/src-docs/src/views/icon/icons.js b/src-docs/src/views/icon/icons.js
@@ -17,6 +17,7 @@ const iconTypes = [
   'arrowRight',
   'arrowUp',
   'asterisk',
+  'beaker',
   'bolt',
   'boxesHorizontal',
   'boxesVertical',

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;
       }
     }
   }

diff --git a/src/components/icon/assets/beaker.svg b/src/components/icon/assets/beaker.svg
diff --git a/src/components/icon/icon.js b/src/components/icon/icon.js
@@ -14,6 +14,7 @@ import arrowRight from './assets/arrow_right.svg';
 import arrowUp from './assets/arrow_up.svg';
 import asterisk from './assets/asterisk.svg';
 import auditbeatApp from './assets/app_auditbeat.svg';
+import beaker from './assets/beaker.svg';
 import bolt from './assets/bolt.svg';
 import boxesHorizontal from './assets/boxes_horizontal.svg';
 import boxesVertical from './assets/boxes_vertical.svg';
@@ -250,6 +251,7 @@ const typeToIconMap = {
   arrowRight,
   arrowUp,
   asterisk,
+  beaker,
   bolt,
   boxesHorizontal,
   boxesVertical,

diff --git a/src/components/icon/index.d.ts b/src/components/icon/index.d.ts
@@ -103,6 +103,7 @@ declare module '@elastic/eui' {
     | 'kqlOperand'
     | 'kqlSelector'
     | 'kqlValue'
+    | 'lab'
     | 'link'
     | 'list'
     | 'listAdd'