fix: update Tooltip component styles for improved layout and responsi…

…veness
AngleProtocol · Dec 16, 2024 · 597f14b · 597f14b
1 parent 9e7166c
commit 597f14b
Showing 1 changed file with 3 additions and 3 deletions.
diff --git a/src/components/primitives/Tooltip.tsx b/src/components/primitives/Tooltip.tsx
@@ -16,17 +16,17 @@ export default function Tooltip({ helper, children, icon = true }: TooltipProps)
     <RadixTooltip.Provider delayDuration={0}>
       <RadixTooltip.Root>
         <RadixTooltip.Trigger asChild>
-          <span className="inline-flex items-center">
+          <span className="flex items-center gap-sm">
             <div>{children}</div>
             {!!icon && <Icon remix="RiQuestionLine" alt="Tooltip" />}
           </span>
         </RadixTooltip.Trigger>
         <RadixTooltip.Portal>
           <RadixTooltip.Content
             style={vars}
-            className="select-none rounded bg-main-1 rounded-full px-lg py-md z-30 leading-none shadow-[hsl(206_22%_7%_/_35%)_0px_10px_38px_-10px,_hsl(206_22%_7%_/_20%)_0px_10px_20px_-15px] will-change-[transform,opacity] data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade"
+            className="select-none rounded-md bg-main-1 rounded-full px-lg py-md z-30 leading-none shadow-[hsl(206_22%_7%_/_35%)_0px_10px_38px_-10px,_hsl(206_22%_7%_/_20%)_0px_10px_20px_-15px] will-change-[transform,opacity] data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade max-w-[90vw] md:max-w-[70vw] lg:max-w-[40vw] xl:max-w-[30vw]"
             sideOffset={5}>
-            <Text size="sm" className="text-main-12">
+            <Text size="sm" className="text-main-12 ">
               {helper}
             </Text>
             <RadixTooltip.Arrow />