Increasing contrast of the tooltip in dark mode.

ClickHouse · Nov 15, 2023 · 3293ddc · 3293ddc · vercel · Nov 15, 2023
1 parent 38d243e
commit 3293ddc
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 2 deletions.
diff --git a/src/components/Tooltip/Tooltip.stories.tsx b/src/components/Tooltip/Tooltip.stories.tsx
@@ -1,5 +1,6 @@
 import { TooltipProps } from "@radix-ui/react-tooltip";
 import { Tooltip } from "./Tooltip";
+import { Text } from "..";
 
 interface Props extends TooltipProps {
   showArrow?: boolean;
@@ -16,7 +17,10 @@ const TooltipExample = ({ showArrow, side, ...props }: Props) => {
       }}
     >
       <Tooltip {...props}>
-        <Tooltip.Trigger>Tooltip Trigger(Hover)</Tooltip.Trigger>
+        <Tooltip.Trigger>
+          <Text>Tooltip Trigger(Hover)</Text>
+        </Tooltip.Trigger>
+
         <Tooltip.Content
           showArrow={showArrow}
           side={side}

diff --git a/src/styles/variables.dark.json b/src/styles/variables.dark.json
@@ -1109,7 +1109,7 @@
     "tooltip": {
       "color": {
         "background": {
-          "default": "lch(100 0 0 / 0.15)"
+          "default": "lch(16.1 0 0 / 0.9)"
         },
         "label": {
           "default": "#ffffff"