fix(#246): 긴급 수정

modern-agile-team · Apr 4, 2024 · 11beb0f · 11beb0f
1 parent b7d575d
commit 11beb0f
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 21 deletions.
diff --git a/src/components/common/globalStyled/styled.ts b/src/components/common/globalStyled/styled.ts
@@ -275,6 +275,7 @@ export const Tooltip = styled.div`
   width: 5vw;
   text-decoration: none;
   color: #fff;
+  z-index: 9999;
   &::after {
     content: '';
     position: absolute;

diff --git a/src/components/molecules/chat-space-elements/chat-space-header/ChatSpaceHeader.tsx b/src/components/molecules/chat-space-elements/chat-space-header/ChatSpaceHeader.tsx
@@ -103,27 +103,36 @@ const ChatSpaceHeader = (props: {
           <span>{chatPartners?.name || ''}</span>
         </S.ChatSpaceHeaderLeft>
         <S.ChatSpaceHeaderRight>
-          <Image
-            src="https://menbosha-s3.s3.ap-northeast-2.amazonaws.com/public/chat/ChatToolTip.svg"
-            alt="Info"
-            width="28"
-            height="28"
-            onClick={handleInfoModal}
-          />
-          <Image
-            src="https://menbosha-s3.s3.ap-northeast-2.amazonaws.com/public/chat/ChatReport.svg"
-            alt="Report"
-            width="28"
-            height="28"
-            onClick={handleReportModal}
-          />
-          <Image
-            onClick={handleModal}
-            src="https://menbosha-s3.s3.ap-northeast-2.amazonaws.com/public/chat/review.svg"
-            alt="Review"
-            width="28"
-            height="28"
-          />
+          <ToolTipContainer hoverBox="image">
+            <TooltipImage
+              src="https://menbosha-s3.s3.ap-northeast-2.amazonaws.com/public/chat/ChatToolTip.svg"
+              alt="Info"
+              width="28"
+              height="28"
+              onClick={handleInfoModal}
+            />
+            <Tooltip>도움말</Tooltip>
+          </ToolTipContainer>
+          <ToolTipContainer hoverBox="image">
+            <TooltipImage
+              src="https://menbosha-s3.s3.ap-northeast-2.amazonaws.com/public/chat/ChatReport.svg"
+              alt="Report"
+              width="28"
+              height="28"
+              onClick={handleReportModal}
+            />
+            <Tooltip>신고</Tooltip>
+          </ToolTipContainer>
+          <ToolTipContainer hoverBox="image">
+            <TooltipImage
+              src="https://menbosha-s3.s3.ap-northeast-2.amazonaws.com/public/chat/review.svg"
+              alt="Review"
+              width="28"
+              height="28"
+              onClick={handleModal}
+            />
+            <Tooltip>리뷰</Tooltip>
+          </ToolTipContainer>
           {isOpenInfo && (
             <ChatInfoModal show={isOpenInfo} hide={handleInfoModal} />
           )}