themesberg
Light mode tooltips use dark mode theme
- [X] I have searched the Issues to see if this bug has already been reported
- [X] I have tested the latest version
Steps to reproduce
- Go to https://flowbite-react.com/docs/components/tooltip#trigger-type
- Click on "Tooltip click"
- Review classes
Current behavior
It appears there is a theme mismatch for tooltips in light mode. Image from: https://flowbite-react.com/docs/components/tooltip#theme
style.light should be: border border-gray-200 bg-white text-gray-900.
style.auto should be: border border-gray-200 bg-white text-gray-900 dark:border-none dark:bg-gray-700 dark:text-white
The inspector seems to indicate that we're getting style.dark:
style.dark is bg-gray-900 text-white dark:bg-gray-700
Expected behavior
White background tooltips with dark text
I think there's a misunderstanding here, when we're talking about light, dark and auto tooltip we're talking about the style of it, not if we're in light or dark mode in tailwind.
Here's a screenshot of the flowbite Tooltip
Now here's some screenshots of the flowbite-react Tooltip
Notice the style prop
I believe I did miss that. Apologies, it even is documented. Though, a couple concerns about even that:
The docs for that section state:
Use the style prop to change the style of the tooltip. The default style is light and you can also use dark.
That does not appear to be the default however:
I checked, and my flowbite-theme-mode is set to light.
I also wonder if the right default might be auto, though that's different than a bug.
