ADCIO-4384) fix: fix tooltip style issue (#96)

* fix: fix tooltip style issue * release: release v0.0.29 --------- Co-authored-by: dev-redo <[email protected]>
corca-ai · Jul 5, 2024 · 886277c · 886277c
1 parent 12b8818
commit 886277c
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/package.json b/package.json
@@ -3,7 +3,7 @@
   "author": "Corca <[email protected]>",
   "description": "Design System for Corca, Inc.",
   "private": false,
-  "version": "0.0.28",
+  "version": "0.0.29",
   "type": "module",
   "packageManager": "[email protected]",
   "main": "dist/index.js",

diff --git a/src/components/Tooltip/index.tsx b/src/components/Tooltip/index.tsx
@@ -4,6 +4,7 @@ import { PropsWithChildren, ReactElement } from 'react';
 import styled from '@emotion/styled';
 
 import { color, typography } from '../styles';
+import { B5 } from '../Text';
 
 export type Placement = 'top' | 'bottom' | 'left' | 'right';
 export type Position = 'start' | 'end' | 'center';
@@ -32,7 +33,7 @@ export function Tooltip({
       <TooltipWrapper className="tooltip-box">
         {withArrow && <TooltipArrow placement={placement} />}
         <TooltipBubble withArrow={withArrow} placement={placement} position={position}>
-          {content}
+          <B5 c="white">{content}</B5>
         </TooltipBubble>
       </TooltipWrapper>
     </TooltipContainer>
@@ -218,13 +219,13 @@ const TooltipBubble = styled.div<BubbleProps>`
   max-width: 300px;
   cursor: help;
   background: ${color['main-black']};
-  color: ${color.white};
   font-size: ${typography.size.xxs}px;
   font-weight: ${typography.weight.regular};
   padding: 7px 10px;
   border-radius: 8px;
   white-space: pre-wrap;
   word-break: break-all;
+  line-height: normal;
 
   ${props => getBubbleMixin(props)}
 `;