fix: UI tweaks to satisfy OHIF-161, OHIF-254, OHIF-167, OHIF-249, OHIF-170, OHIF-162

* add group hover for borderColor

* measurements action buttons hover state

* fixes and button/buttongroup/iconButton refactor

* OHIF-161: Fix Tracked/Untracked Text in Thumbnail's Tooltip

* OHIF-254: Format SR series date

* OHIF-167 - Fix Study Date Time format

* OHIF-249: Fix viewport border thickness and action bar min height

* pass viewportIdentificator to SR Thumbnail

* show tooltip when hover over the SR thumbnail

* OHIF-170: Display tooltip when hovering over an untracked series in the Viewport Action Bar

* Undo accidental date change

* Sneak in "Create Report" messaging for createReport notifications

* Fix text clipping

* Add no-select text styles for action bar, thumbnail, and thumbnail no image (sr)

* fix for OHIF-162

Modified to remove Viewport Identifier. Text now only reads: “Structured Report”This was partly to address a bug where the Viewport Identifier was incorrect for all but the first displayed SR. Component API changed for ThumbnailNoImage to accomodate any generic “modalityTooltip”

* Some ViewportPane resize magic

Co-authored-by: dannyrb <danny.ri.brown@gmail.com>

platform/ui/src/components/IconButton/IconButton.jsx

@@ -28,6 +28,8 @@ const variantClasses = {
       'text-secondary-light hover:bg-secondary-light hover:text-white active:opacity-80 focus:bg-secondary-light focus:text-white',
     white:
       'text-white hover:bg-white hover:text-black active:opacity-80 focus:bg-white focus:text-black',
+    black:
+      'text-black hover:bg-black hover:text-white focus:bg-black focus:text-white active:opacity-80',
   },
   outlined: {
     default:
@@ -38,6 +40,8 @@ const variantClasses = {
       'border bg-transparent border-secondary-light text-secondary-light hover:opacity-80 active:opacity-100 focus:opacity-80',
     white:
       'border bg-transparent border-white text-white hover:opacity-80 active:opacity-100 focus:opacity-80',
+    black:
+      'border bg-black border-primary-main text-white hover:bg-primary-main focus:bg-primary-main hover:border-black focus:border-black',
   },
   contained: {
     default:
@@ -48,6 +52,8 @@ const variantClasses = {
       'bg-secondary-light text-white hover:opacity-80 active:opacity-100 focus:opacity-80',
     white:
       'bg-white text-black hover:opacity-80 active:opacity-100 focus:opacity-80',
+    black:
+      'bg-black text-white hover:opacity-80 active:opacity-100 focus:opacity-80',
   },
 };
 
@@ -113,7 +119,7 @@ const IconButton = ({
 };
 
 IconButton.defaultProps = {
-  onClick: () => { },
+  onClick: () => {},
   color: 'default',
   disabled: false,
   fullWidth: false,
@@ -133,6 +139,7 @@ IconButton.propTypes = {
     'primary',
     'secondary',
     'white',
+    'black',
     'inherit',
   ]),
   fullWidth: PropTypes.bool,