From 43dd5e6d11cf0c6fc95e3348052f1be190ad944a Mon Sep 17 00:00:00 2001
From: Xiao Yijun <xiaoyijun@silverhand.io>
Date: Mon, 29 May 2023 10:50:16 +0800
Subject: [PATCH] fix(console): fix toggle tip z-index on modal layer (#3917)

---
 .../console/src/components/Tip/ToggleTip/index.module.scss    | 4 ++--
 packages/console/src/components/Tip/ToggleTip/index.tsx       | 4 +++-
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/packages/console/src/components/Tip/ToggleTip/index.module.scss b/packages/console/src/components/Tip/ToggleTip/index.module.scss
index d9a91ab64..47a57ab04 100644
--- a/packages/console/src/components/Tip/ToggleTip/index.module.scss
+++ b/packages/console/src/components/Tip/ToggleTip/index.module.scss
@@ -2,8 +2,8 @@
 
 .overlay {
   background: transparent;
-  position: fixed;
-  inset: 0;
+  padding: unset;
+  overflow-y: unset;
 
   .content {
     position: relative;
diff --git a/packages/console/src/components/Tip/ToggleTip/index.tsx b/packages/console/src/components/Tip/ToggleTip/index.tsx
index 12afdcdd5..21a94ca39 100644
--- a/packages/console/src/components/Tip/ToggleTip/index.tsx
+++ b/packages/console/src/components/Tip/ToggleTip/index.tsx
@@ -1,8 +1,10 @@
+import classNames from 'classnames';
 import type { ReactNode } from 'react';
 import { useCallback, useState, useRef } from 'react';
 import ReactModal from 'react-modal';
 
 import usePosition from '@/hooks/use-position';
+import * as modalStyles from '@/scss/modal.module.scss';
 import type { HorizontalAlignment } from '@/types/positioning';
 import { onKeyDownHandler } from '@/utils/a11y';
 
@@ -79,7 +81,7 @@ function ToggleTip({
         shouldCloseOnEsc
         isOpen={isOpen}
         className={styles.content}
-        overlayClassName={styles.overlay}
+        overlayClassName={classNames(modalStyles.overlay, styles.overlay)}
         onRequestClose={onClose}
         onAfterOpen={mutate}
       >