From 36edd97016012ec158a012d274e40f3c21df459e Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Mon, 16 Dec 2024 15:44:19 +0100
Subject: [PATCH] console: Fix tooltip style

---
 pkg/webui/components/tooltip/index.js                |  6 ------
 pkg/webui/components/tooltip/tooltip.styl            |  2 +-
 .../containers/shortcut-panel/shortcut-item/index.js | 12 ++++++++++--
 .../shortcut-panel/shortcut-item/shortcut-item.styl  |  3 +++
 4 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/pkg/webui/components/tooltip/index.js b/pkg/webui/components/tooltip/index.js
index 58fc853e6aa..6a73b6cb0b1 100644
--- a/pkg/webui/components/tooltip/index.js
+++ b/pkg/webui/components/tooltip/index.js
@@ -23,12 +23,6 @@ import style from './tooltip.styl'
 let currentInstance
 
 const popperModifiers = [
-  {
-    name: 'offset',
-    options: {
-      offset: [-12, 8],
-    },
-  },
   {
     name: 'arrow',
     options: {
diff --git a/pkg/webui/components/tooltip/tooltip.styl b/pkg/webui/components/tooltip/tooltip.styl
index 164f7756213..c9d64c9f203 100644
--- a/pkg/webui/components/tooltip/tooltip.styl
+++ b/pkg/webui/components/tooltip/tooltip.styl
@@ -17,7 +17,7 @@
 :global {
   .tippy-box {
     z-index: $zi.tooltip
-    border-radius: $br.m
+    border-radius: $br.xl
     background: var(--c-bg-neutral-heavy)
     color: var(--c-text-neutral-min)
     padding: $cs.m
diff --git a/pkg/webui/console/containers/shortcut-panel/shortcut-item/index.js b/pkg/webui/console/containers/shortcut-panel/shortcut-item/index.js
index 6319a95eef1..d263b51d497 100644
--- a/pkg/webui/console/containers/shortcut-panel/shortcut-item/index.js
+++ b/pkg/webui/console/containers/shortcut-panel/shortcut-item/index.js
@@ -27,13 +27,21 @@ import style from './shortcut-item.styl'
 
 const ShortcutItem = ({ icon, link, action, title, className }) =>
   action ? (
-    <Tooltip content={<Message content={title} />}>
+    <Tooltip
+      content={<Message content={title} />}
+      className={classnames(style.shortcutTooltip, 'fs-m br-l')}
+      delay={0}
+    >
       <button onClick={action} className={classnames(style.shortcut, className)}>
         <Icon icon={icon} className={style.icon} size={28} />
       </button>
     </Tooltip>
   ) : (
-    <Tooltip content={<Message content={title} />}>
+    <Tooltip
+      content={<Message content={title} />}
+      className={classnames(style.shortcutTooltip, 'fs-m br-l')}
+      delay={0}
+    >
       <Link to={link} className={classnames(style.shortcut, className)}>
         <Icon icon={icon} className={style.icon} size={28} />
       </Link>
diff --git a/pkg/webui/console/containers/shortcut-panel/shortcut-item/shortcut-item.styl b/pkg/webui/console/containers/shortcut-panel/shortcut-item/shortcut-item.styl
index 3b0f5a78605..5644e57b770 100644
--- a/pkg/webui/console/containers/shortcut-panel/shortcut-item/shortcut-item.styl
+++ b/pkg/webui/console/containers/shortcut-panel/shortcut-item/shortcut-item.styl
@@ -12,6 +12,9 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
+.shortcut-tooltip
+  padding: $cs.xs $cs.m 0.6rem
+
 .shortcut
   padding: $cs.s $cs.m
   background: var(--c-bg-brand-light)