Added & fixed some icons (#881)

elastic · May 25, 2018 · 09301c2 · 09301c2
1 parent 8b9a56f
commit 09301c2
Show file tree

Hide file tree

Showing 10 changed files with 77 additions and 40 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -6,7 +6,7 @@ No public changes since 0.0.50
 
 - Created `EuiToggle`, `EuiButtonToggle`, and `EuiButtonGroup` ([#872](https://github.com/elastic/eui/pull/872))
 - `EuiBasicTable` and `EuiInMemoryTable` now accept `rowProps` and `cellProps` callbacks,
-which let you apply custom props to rows and props ([#869](https://github.com/elastic/eui/pull/869))
+- Added `offine` and `online` icons ([#881](https://github.com/elastic/eui/pull/881))
 
 **Breaking changes**
 

diff --git a/src-docs/src/views/icon/icons.js b/src-docs/src/views/icon/icons.js
@@ -94,6 +94,8 @@ const iconTypes = [
   'minusInCircle',
   'node',
   'number',
+  'offline',
+  'online',
   'pause',
   'pencil',
   'pin',

diff --git a/src/components/icon/__snapshots__/icon.test.js.snap b/src/components/icon/__snapshots__/icon.test.js.snap
@@ -2490,7 +2490,7 @@ exports[`EuiIcon renders type logoElastic 1`] = `
 </svg>
 `;
 
-exports[`EuiIcon renders type logoElasticsearch 1`] = `
+exports[`EuiIcon renders type logoElasticStack 1`] = `
 <svg
   class="euiIcon euiIcon--medium"
   height="32"
@@ -2500,38 +2500,30 @@ exports[`EuiIcon renders type logoElasticsearch 1`] = `
 >
   <g
     fill="none"
+    fill-rule="evenodd"
   >
     <path
-      d="M23.04 11.2h-8.36c.04.2.12.4.16.56.28.96.44 1.96.52 3 .04.4.04.84.04 1.24s0 .84-.04 1.24c-.08 1.04-.24 2.04-.52 3-.04.2-.12.4-.16.56h8.36c2.64 0 4.76-2.16 4.76-4.8 0-2.64-2.12-4.8-4.76-4.8z"
-      fill="#00A9E5"
+      d="M.395 3.64A3.137 3.137 0 0 1 3.533.501h24.94a3.137 3.137 0 0 1 3.138 3.137v6.237H.395V3.64z"
+      fill="#EF5098"
     />
     <path
-      d="M15.36 17.24c.04-.4.04-.84.04-1.24s0-.84-.04-1.24c-.08-1.04-.24-2.04-.52-3-.04-.2-.12-.4-.16-.56H1.72C1.24 12.72 1 14.32 1 16c0 1.68.24 3.28.72 4.8h12.92c.04-.2.12-.4.16-.56.28-.96.48-1.96.56-3z"
-      fill="#353535"
+      d="M.395 22.356h14.82v9.362H3.515a3.137 3.137 0 0 1-3.138-3.056l.02-6.306z"
+      fill="#14A8E0"
     />
     <path
-      d="M24.48 22.4h-10.4c-.32.72-.68 1.4-1.08 2.04-.6 1-1.32 1.88-2.12 2.72-.28.28-.56.52-.84.8-.56.52-1.2.96-1.84 1.4A15.83 15.83 0 0 0 17 32c5.56 0 10.44-2.84 13.32-7.12a8.158 8.158 0 0 0-5.84-2.48z"
-      fill="#00BFB3"
+      d="M16.778 22.356h14.82v6.237a3.137 3.137 0 0 1-3.137 3.137H16.778v-9.374z"
+      fill="#FDD10D"
     />
     <path
-      d="M13 24.44c.4-.64.76-1.32 1.08-2.04H2.32c1.24 2.84 3.28 5.28 5.88 6.96.64-.44 1.24-.88 1.84-1.4.28-.24.56-.52.84-.8.76-.8 1.48-1.72 2.12-2.72z"
-      fill="#019B8F"
+      d="M.395 11.438h31.197V20.8H.395z"
+      fill="#20BBB1"
+      fill-rule="nonzero"
     />
-    <g>
-      <path
-        d="M10.84 4.84c-.28-.28-.56-.52-.84-.8-.56-.52-1.2-.96-1.84-1.4C5.64 4.32 3.6 6.76 2.32 9.6h11.72c-.32-.72-.68-1.4-1.08-2.04-.6-1-1.32-1.92-2.12-2.72z"
-        fill="#F9B110"
-      />
-      <path
-        d="M17 0c-3.24 0-6.28.96-8.8 2.64.64.44 1.24.88 1.84 1.4.28.24.56.52.84.8.8.84 1.52 1.72 2.12 2.72.4.64.76 1.32 1.08 2.04h10.4c2.28 0 4.36-.96 5.84-2.48C27.44 2.84 22.56 0 17 0z"
-        fill="#FED10A"
-      />
-    </g>
   </g>
 </svg>
 `;
 
-exports[`EuiIcon renders type logoElasticStack 1`] = `
+exports[`EuiIcon renders type logoElasticsearch 1`] = `
 <svg
   class="euiIcon euiIcon--medium"
   height="32"
@@ -2541,25 +2533,33 @@ exports[`EuiIcon renders type logoElasticStack 1`] = `
 >
   <g
     fill="none"
-    fill-rule="evenodd"
   >
     <path
-      d="M.395 3.64A3.137 3.137 0 0 1 3.533.501h24.94a3.137 3.137 0 0 1 3.138 3.137v6.237H.395V3.64z"
-      fill="#EF5098"
+      d="M23.04 11.2h-8.36c.04.2.12.4.16.56.28.96.44 1.96.52 3 .04.4.04.84.04 1.24s0 .84-.04 1.24c-.08 1.04-.24 2.04-.52 3-.04.2-.12.4-.16.56h8.36c2.64 0 4.76-2.16 4.76-4.8 0-2.64-2.12-4.8-4.76-4.8z"
+      fill="#00A9E5"
     />
     <path
-      d="M.395 22.356h14.82v9.362H3.515a3.137 3.137 0 0 1-3.138-3.056l.02-6.306z"
-      fill="#14A8E0"
+      d="M15.36 17.24c.04-.4.04-.84.04-1.24s0-.84-.04-1.24c-.08-1.04-.24-2.04-.52-3-.04-.2-.12-.4-.16-.56H1.72C1.24 12.72 1 14.32 1 16c0 1.68.24 3.28.72 4.8h12.92c.04-.2.12-.4.16-.56.28-.96.48-1.96.56-3z"
+      fill="#353535"
     />
     <path
-      d="M16.778 22.356h14.82v6.237a3.137 3.137 0 0 1-3.137 3.137H16.778v-9.374z"
-      fill="#FDD10D"
+      d="M24.48 22.4h-10.4c-.32.72-.68 1.4-1.08 2.04-.6 1-1.32 1.88-2.12 2.72-.28.28-.56.52-.84.8-.56.52-1.2.96-1.84 1.4A15.83 15.83 0 0 0 17 32c5.56 0 10.44-2.84 13.32-7.12a8.158 8.158 0 0 0-5.84-2.48z"
+      fill="#00BFB3"
     />
     <path
-      d="M.395 11.438h31.197V20.8H.395z"
-      fill="#20BBB1"
-      fill-rule="nonzero"
+      d="M13 24.44c.4-.64.76-1.32 1.08-2.04H2.32c1.24 2.84 3.28 5.28 5.88 6.96.64-.44 1.24-.88 1.84-1.4.28-.24.56-.52.84-.8.76-.8 1.48-1.72 2.12-2.72z"
+      fill="#019B8F"
     />
+    <g>
+      <path
+        d="M10.84 4.84c-.28-.28-.56-.52-.84-.8-.56-.52-1.2-.96-1.84-1.4C5.64 4.32 3.6 6.76 2.32 9.6h11.72c-.32-.72-.68-1.4-1.08-2.04-.6-1-1.32-1.92-2.12-2.72z"
+        fill="#F9B110"
+      />
+      <path
+        d="M17 0c-3.24 0-6.28.96-8.8 2.64.64.44 1.24.88 1.84 1.4.28.24.56.52.84.8.8.84 1.52 1.72 2.12 2.72.4.64.76 1.32 1.08 2.04h10.4c2.28 0 4.36-.96 5.84-2.48C27.44 2.84 22.56 0 17 0z"
+        fill="#FED10A"
+      />
+    </g>
   </g>
 </svg>
 `;
@@ -3113,7 +3113,7 @@ exports[`EuiIcon renders type minusInCircle 1`] = `
   xmlns="http://www.w3.org/2000/svg"
 >
   <path
-    d="M7.5 14a6.5 6.5 0 1 0 0-13 6.5 6.5 0 0 0 0 13zm0 1a7.5 7.5 0 1 1 0-15 7.5 7.5 0 0 1 0 15zm-4-8h8a.5.5 0 1 1 0 1h-8a.5.5 0 0 1 0-1z"
+    d="M4 8h7V7H4v1zm3.5-8C11.636 0 15 3.364 15 7.5S11.636 15 7.5 15 0 11.636 0 7.5 3.364 0 7.5 0zm0 .882a6.618 6.618 0 1 0 0 13.236A6.618 6.618 0 0 0 7.5.882z"
   />
 </svg>
 `;
@@ -3155,7 +3155,6 @@ exports[`EuiIcon renders type node 1`] = `
 >
   <path
     d="M8.5 1.443a1 1 0 0 0-1 0L2.572 4.29a1 1 0 0 0-.5.866v5.69a1 1 0 0 0 .5.866L7.5 14.557a1 1 0 0 0 1 0l4.928-2.846a1 1 0 0 0 .5-.866v-5.69a1 1 0 0 0-.5-.866L8.5 1.443zM9 .577l4.928 2.846a2 2 0 0 1 1 1.732v5.69a2 2 0 0 1-1 1.732L9 15.423a2 2 0 0 1-2 0l-4.928-2.846a2 2 0 0 1-1-1.732v-5.69a2 2 0 0 1 1-1.732L7 .577a2 2 0 0 1 2 0z"
-    fill="#13252D"
   />
 </svg>
 `;
@@ -3175,6 +3174,34 @@ exports[`EuiIcon renders type number 1`] = `
 </svg>
 `;
 
+exports[`EuiIcon renders type offline 1`] = `
+<svg
+  class="euiIcon euiIcon--medium"
+  height="16"
+  viewBox="0 0 16 16"
+  width="16"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    d="M6.384 12.405l1.5-1.5a1.62 1.62 0 1 1-1.5 1.5zm3.01-3.01l.744-.744c.386.213.74.485 1.051.808a.5.5 0 0 1-.721.693 3.422 3.422 0 0 0-1.075-.757zm2.053-2.054l.72-.719c.372.264.722.565 1.042.899a.5.5 0 1 1-.721.692 6.253 6.253 0 0 0-1.04-.872zm-4.753-.904A6.2 6.2 0 0 0 3.54 8.185a.5.5 0 0 1-.717-.697A7.198 7.198 0 0 1 7.83 5.302L6.694 6.437zm6.76-1.102l.713-.713c.374.293.73.613 1.062.96a.5.5 0 0 1-.721.692 9.086 9.086 0 0 0-1.054-.94zm-3.948-1.71A9.08 9.08 0 0 0 8 3.5a8.99 8.99 0 0 0-6.469 2.734.5.5 0 1 1-.717-.697A9.99 9.99 0 0 1 8 2.5c.804 0 1.593.095 2.353.278l-.847.847zM8 13.14a.62.62 0 1 0 0-1.24.62.62 0 0 0 0 1.24zm-6.146 1.714a.5.5 0 0 1-.708-.708l13-13a.5.5 0 0 1 .708.708l-13 13z"
+  />
+</svg>
+`;
+
+exports[`EuiIcon renders type online 1`] = `
+<svg
+  class="euiIcon euiIcon--medium"
+  height="16"
+  viewBox="0 0 16 16"
+  width="16"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    d="M8 14.14a1.62 1.62 0 1 1 0-3.24 1.62 1.62 0 0 1 0 3.24zm0-1a.62.62 0 1 0 0-1.24.62.62 0 0 0 0 1.24zm3.189-3.68a.5.5 0 0 1-.721.692A3.408 3.408 0 0 0 8 9.1c-.937 0-1.813.378-2.453 1.037a.5.5 0 0 1-.717-.697A4.408 4.408 0 0 1 8 8.1c1.22 0 2.361.497 3.189 1.36zm2.02-1.94a.5.5 0 1 1-.721.693A6.2 6.2 0 0 0 8 6.3a6.199 6.199 0 0 0-4.46 1.885.5.5 0 0 1-.718-.697A7.199 7.199 0 0 1 8 5.3a7.2 7.2 0 0 1 5.21 2.22zm2.02-1.938a.5.5 0 0 1-.721.692A8.99 8.99 0 0 0 8 3.5a8.99 8.99 0 0 0-6.469 2.734.5.5 0 1 1-.717-.697A9.99 9.99 0 0 1 8 2.5a9.99 9.99 0 0 1 7.23 3.082z"
+  />
+</svg>
+`;
+
 exports[`EuiIcon renders type pause 1`] = `
 <svg
   class="euiIcon euiIcon--medium"
@@ -3540,7 +3567,6 @@ exports[`EuiIcon renders type shard 1`] = `
 >
   <path
     d="M5.134 7.031L8 12.764l2.866-5.733L8 2.016 5.134 7.03zM8 0l4 7-4 8-4-8 4-7z"
-    fill="#13252D"
   />
 </svg>
 `;
@@ -3678,7 +3704,6 @@ exports[`EuiIcon renders type stats 1`] = `
 >
   <path
     d="M8 14v-4h1v4h5V5h1v9a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-2h1v2h6zm4.853-10.146l-2.999 3a1.5 1.5 0 0 1-2.538 1.568l-2.714.904L4 9.527a1.5 1.5 0 1 1-.316-.948L7 7.473a1.5 1.5 0 0 1 2.146-1.327l3-3a1.5 1.5 0 1 1 .707.707z"
-    fill="#3F3F3F"
     fill-rule="evenodd"
   />
 </svg>

diff --git a/src/components/icon/assets/minus_in_circle.svg b/src/components/icon/assets/minus_in_circle.svg
diff --git a/src/components/icon/assets/node.svg b/src/components/icon/assets/node.svg
diff --git a/src/components/icon/assets/offline.svg b/src/components/icon/assets/offline.svg
diff --git a/src/components/icon/assets/online.svg b/src/components/icon/assets/online.svg
diff --git a/src/components/icon/assets/shard.svg b/src/components/icon/assets/shard.svg
diff --git a/src/components/icon/assets/stats.svg b/src/components/icon/assets/stats.svg
diff --git a/src/components/icon/icon.js b/src/components/icon/icon.js
@@ -125,6 +125,8 @@ import minusInCircle from './assets/minus_in_circle.svg';
 import monitoringApp from './assets/app_monitoring.svg';
 import node from './assets/node.svg';
 import number from './assets/number.svg';
+import offline from './assets/offline.svg';
+import online from './assets/online.svg';
 import pause from './assets/pause.svg';
 import pencil from './assets/pencil.svg';
 import pin from './assets/pin.svg';
@@ -291,6 +293,8 @@ const typeToIconMap = {
   monitoringApp,
   node,
   number,
+  offline,
+  online,
   pause,
   pencil,
   pin,