Fix [UI] Edit a an artifact tag from the overview tab does not have e…

…xit option (#98)
iguazio · Dec 20, 2022 · 8b274e4 · 8b274e4
1 parent c2d2743
commit 8b274e4
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 15 deletions.
diff --git a/src/lib/components/RoundedIcon/RoundedIcon.js b/src/lib/components/RoundedIcon/RoundedIcon.js
@@ -24,28 +24,18 @@ import TextTooltipTemplate from '../TooltipTemplate/TextTooltipTemplate'
 import './roundedIcon.scss'
 
 const RoundedIcon = React.forwardRef(
-  (
-    { children, className, disabled, id, isActive, onClick, tooltipText },
-    ref
-  ) => {
+  ({ children, className, disabled, id, isActive, onClick, tooltipText }, ref) => {
     const wrapperClassNames = classNames('round-icon-cp', className)
     const IconClassNames = classNames(
       'round-icon-cp__circle',
-      isActive && 'round-icon-cp__circle-active'
+      isActive && 'round-icon-cp__circle-active',
+      disabled && 'round-icon-cp__circle-disabled'
     )
 
     return (
       <div className={wrapperClassNames} ref={ref}>
-        <Tooltip
-          hidden={!tooltipText}
-          template={<TextTooltipTemplate text={tooltipText} />}
-        >
-          <button
-            onClick={onClick}
-            disabled={disabled}
-            id={id}
-            className={IconClassNames}
-          >
+        <Tooltip hidden={!tooltipText} template={<TextTooltipTemplate text={tooltipText} />}>
+          <button onClick={onClick} disabled={disabled} id={id} className={IconClassNames}>
             {children}
           </button>
         </Tooltip>

diff --git a/src/lib/components/RoundedIcon/roundedIcon.scss b/src/lib/components/RoundedIcon/roundedIcon.scss
@@ -41,5 +41,17 @@
         opacity: 1;
       }
     }
+
+    &-disabled {
+      path {
+        fill: $spunPearl;
+      }
+
+      &:hover {
+        &::before {
+          opacity: 0;
+        }
+      }
+    }
   }
 }