Updating icons naming and colors

platform/ui/src/assets/icons/group-layers.svg

@@ -1,5 +1,5 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 25 25">
-    <g fill="none" fill-rule="evenodd" stroke="#348CFD" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" transform="translate(1 1)">
+    <g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" transform="translate(1 1)">
         <path d="M6 17H1c-.552 0-1-.448-1-1V1c0-.552.448-1 1-1h15c.552 0 1 .448 1 1v5"/>
         <rect width="17" height="17" x="6" y="6" rx="1"/>
     </g>

platform/ui/src/assets/icons/list-bullets.svg

@@ -1,5 +1,5 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="26" height="23" viewBox="0 0 26 23">
-    <g fill="none" fill-rule="evenodd" stroke="#348CFD" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" transform="translate(1 1)">
+    <g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" transform="translate(1 1)">
         <circle cx="2.5" cy="2.498" r="2"/>
         <path d="M8.5 2.498L23.5 2.498"/>
         <circle cx="2.5" cy="10.498" r="2"/>

platform/ui/src/assets/icons/push-left.svg

@@ -1,5 +1,5 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="20" height="12" viewBox="0 0 20 12">
-    <g fill="none" fill-rule="evenodd" stroke="#348CFD" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5">
+    <g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5">
         <path d="M20 5.906L6.818 5.906M12.273.452L6.818 5.906 12.273 11.361M.909 11.361L.909.452"/>
     </g>
 </svg>

platform/ui/src/assets/icons/push-right.svg

@@ -1,5 +1,5 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="20" height="12" viewBox="0 0 20 12">
-    <g fill="none" fill-rule="evenodd" stroke="#348CFD" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5">
+    <g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5">
         <path d="M20 5.906L6.818 5.906M12.273.452L6.818 5.906 12.273 11.361M.909 11.361L.909.452" transform="matrix(-1 0 0 1 20 0)"/>
     </g>
 </svg>

platform/ui/src/components/Icon/getIcon.jsx

@@ -7,7 +7,7 @@ import cancel from './../../assets/icons/cancel.svg';
 import chevronDown from './../../assets/icons/chevron-down.svg';
 import chevronLeft from './../../assets/icons/chevron-left.svg';
 import chevronRight from './../../assets/icons/chevron-right.svg';
-import iconNavStudies from './../../assets/icons/icon-nav-studies.svg';
+import groupLayers from './../../assets/icons/group-layers.svg';
 import infoLink from './../../assets/icons/info-link.svg';
 import launchArrow from './../../assets/icons/launch-arrow.svg';
 import launchInfo from './../../assets/icons/launch-info.svg';
@@ -15,8 +15,8 @@ import listBullets from './../../assets/icons/list-bullets.svg';
 import logoOhifSmall from './../../assets/icons/logo-ohif-small.svg';
 import magnifier from './../../assets/icons/magnifier.svg';
 import notificationwarningDiamond from './../../assets/icons/notificationwarning-diamond.svg';
-import panelLeft from './../../assets/icons/panel-left.svg';
+import pushLeft from './../../assets/icons/push-left.svg';
-import panelRight from './../../assets/icons/panel-right.svg';
+import pushRight from './../../assets/icons/push-right.svg';
 import settings from './../../assets/icons/settings.svg';
 import sorting from './../../assets/icons/sorting.svg';
 import sortingActiveDown from './../../assets/icons/sorting-active-down.svg';
@@ -37,7 +37,7 @@ const ICONS = {
   'chevron-down': chevronDown,
   'chevron-left': chevronLeft,
   'chevron-right': chevronRight,
-  'icon-nav-studies': iconNavStudies,
+  'group-layers': groupLayers,
   'info-link': infoLink,
   'launch-arrow': launchArrow,
   'launch-info': launchInfo,
@@ -45,8 +45,8 @@ const ICONS = {
   'logo-ohif-small': logoOhifSmall,
   magnifier: magnifier,
   'notificationwarning-diamond': notificationwarningDiamond,
-  'panel-left': panelLeft,
+  'push-left': pushLeft,
-  'panel-right': panelRight,
+  'push-right': pushRight,
   settings: settings,
   'sorting-active-down': sortingActiveDown,
   'sorting-active-up': sortingActiveUp,

platform/ui/src/components/SidePanel/SidePanel.jsx

@@ -40,8 +40,8 @@ const classesMap = {
 };
 
 const openIconName = {
-  left: 'panel-left',
+  left: 'push-left',
-  right: 'panel-right',
+  right: 'push-right',
 };
 
 const SidePanel = ({

platform/ui/src/components/SidePanel/SidePanel.mdx

@@ -21,7 +21,7 @@ import { SidePanel } from '@ohif/ui';
   <div className="flex flex-row flex-no-wrap flex-1 items-stretch overflow-hidden w-full" style={{height: '500px'}}>
     <SidePanel
       side="left"
-      iconName="icon-nav-studies"
+      iconName="group-layers"
       iconLabel="Studies"
       componentLabel="Studies"
       defaultIsOpen={false}

platform/ui/src/views/Viewer/Viewer.js

@@ -15,7 +15,7 @@ const Viewer = () => {
       >
         <SidePanel
           side="left"
-          iconName="icon-nav-studies"
+          iconName="group-layers"
           iconLabel="Studies"
           componentLabel="Studies"
           defaultIsOpen={false}

platform/ui/src/views/Viewer/Viewer.mdx

@@ -22,7 +22,7 @@ import { NavBar, SidePanel, Svg } from '@ohif/ui';
     >
       <SidePanel
         side="left"
-        iconName="icon-nav-studies"
+        iconName="group-layers"
         iconLabel="Studies"
         componentLabel="Studies"
         defaultIsOpen={false}