PR feedback from Caroline

elastic · Apr 26, 2022 · 0f03e0f · 0f03e0f
1 parent 7c68b07
commit 0f03e0f
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 19 deletions.
diff --git a/src/components/health/__snapshots__/health.test.tsx.snap b/src/components/health/__snapshots__/health.test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`EuiHealth is rendered 1`] = `
 <div
   aria-label="aria-label"
-  class="euiHealth testClass1 testClass2 css-1p3stn6-euiHealth-s"
+  class="euiHealth testClass1 testClass2 css-1go2jns-euiHealth-s"
   data-test-subj="test subject string"
 >
   <div
@@ -25,7 +25,7 @@ exports[`EuiHealth is rendered 1`] = `
 
 exports[`EuiHealth props color #000000 is rendered 1`] = `
 <div
-  class="euiHealth css-1p3stn6-euiHealth-s"
+  class="euiHealth css-1go2jns-euiHealth-s"
 >
   <div
     class="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
@@ -47,7 +47,7 @@ exports[`EuiHealth props color #000000 is rendered 1`] = `
 
 exports[`EuiHealth props color accent is rendered 1`] = `
 <div
-  class="euiHealth css-1p3stn6-euiHealth-s"
+  class="euiHealth css-1go2jns-euiHealth-s"
 >
   <div
     class="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
@@ -69,7 +69,7 @@ exports[`EuiHealth props color accent is rendered 1`] = `
 
 exports[`EuiHealth props color danger is rendered 1`] = `
 <div
-  class="euiHealth css-1p3stn6-euiHealth-s"
+  class="euiHealth css-1go2jns-euiHealth-s"
 >
   <div
     class="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
@@ -91,7 +91,7 @@ exports[`EuiHealth props color danger is rendered 1`] = `
 
 exports[`EuiHealth props color default is rendered 1`] = `
 <div
-  class="euiHealth css-1p3stn6-euiHealth-s"
+  class="euiHealth css-1go2jns-euiHealth-s"
 >
   <div
     class="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
@@ -113,7 +113,7 @@ exports[`EuiHealth props color default is rendered 1`] = `
 
 exports[`EuiHealth props color ghost is rendered 1`] = `
 <div
-  class="euiHealth css-1p3stn6-euiHealth-s"
+  class="euiHealth css-1go2jns-euiHealth-s"
 >
   <div
     class="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
@@ -135,7 +135,7 @@ exports[`EuiHealth props color ghost is rendered 1`] = `
 
 exports[`EuiHealth props color inherit is rendered 1`] = `
 <div
-  class="euiHealth css-1p3stn6-euiHealth-s"
+  class="euiHealth css-1go2jns-euiHealth-s"
 >
   <div
     class="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
@@ -157,7 +157,7 @@ exports[`EuiHealth props color inherit is rendered 1`] = `
 
 exports[`EuiHealth props color primary is rendered 1`] = `
 <div
-  class="euiHealth css-1p3stn6-euiHealth-s"
+  class="euiHealth css-1go2jns-euiHealth-s"
 >
   <div
     class="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
@@ -179,7 +179,7 @@ exports[`EuiHealth props color primary is rendered 1`] = `
 
 exports[`EuiHealth props color subdued is rendered 1`] = `
 <div
-  class="euiHealth css-1p3stn6-euiHealth-s"
+  class="euiHealth css-1go2jns-euiHealth-s"
 >
   <div
     class="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
@@ -201,7 +201,7 @@ exports[`EuiHealth props color subdued is rendered 1`] = `
 
 exports[`EuiHealth props color success is rendered 1`] = `
 <div
-  class="euiHealth css-1p3stn6-euiHealth-s"
+  class="euiHealth css-1go2jns-euiHealth-s"
 >
   <div
     class="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
@@ -223,7 +223,7 @@ exports[`EuiHealth props color success is rendered 1`] = `
 
 exports[`EuiHealth props color text is rendered 1`] = `
 <div
-  class="euiHealth css-1p3stn6-euiHealth-s"
+  class="euiHealth css-1go2jns-euiHealth-s"
 >
   <div
     class="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
@@ -245,7 +245,7 @@ exports[`EuiHealth props color text is rendered 1`] = `
 
 exports[`EuiHealth props color warning is rendered 1`] = `
 <div
-  class="euiHealth css-1p3stn6-euiHealth-s"
+  class="euiHealth css-1go2jns-euiHealth-s"
 >
   <div
     class="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
@@ -289,7 +289,7 @@ exports[`EuiHealth props textSize inherit is rendered 1`] = `
 
 exports[`EuiHealth props textSize m is rendered 1`] = `
 <div
-  class="euiHealth css-358avy-euiHealth-m"
+  class="euiHealth css-nsbil5-euiHealth-m"
 >
   <div
     class="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
@@ -311,7 +311,7 @@ exports[`EuiHealth props textSize m is rendered 1`] = `
 
 exports[`EuiHealth props textSize s is rendered 1`] = `
 <div
-  class="euiHealth css-1p3stn6-euiHealth-s"
+  class="euiHealth css-1go2jns-euiHealth-s"
 >
   <div
     class="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
@@ -333,7 +333,7 @@ exports[`EuiHealth props textSize s is rendered 1`] = `
 
 exports[`EuiHealth props textSize xs is rendered 1`] = `
 <div
-  class="euiHealth css-1yr971c-euiHealth-xs"
+  class="euiHealth css-1o1s5ug-euiHealth-xs"
 >
   <div
     class="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"

diff --git a/src/components/health/health.styles.ts b/src/components/health/health.styles.ts
@@ -8,21 +8,21 @@
 
 import { css } from '@emotion/react';
 import { UseEuiTheme } from '../../services';
-import { euiFontSizeFromScale } from '../../global_styling';
+import { euiFontSize } from '../../global_styling';
 
 export const euiHealthStyles = ({ euiTheme }: UseEuiTheme) => ({
   euiHealth: css`
     display: inline-block;
   `,
   // Text sizes
   xs: css`
-    ${euiFontSizeFromScale('xs', euiTheme)}
+    font-size: ${euiFontSize('xs', euiTheme).fontSize};
   `,
   s: css`
-    ${euiFontSizeFromScale('s', euiTheme)}
+    font-size: ${euiFontSize('s', euiTheme).fontSize};
   `,
   m: css`
-    ${euiFontSizeFromScale('m', euiTheme)}
+    font-size: ${euiFontSize('m', euiTheme).fontSize};
   `,
   inherit: css`
     font-size: inherit;