Next.js Discord

Discord Forum

I need helps with my shadcn/ui component in NextJS. Specifically with the DropdownMenu.

Answered
sh1ro posted this in #help-forum
Open in Discord
sh1roOP
I don't want to use dark/light mode on my web app, but, there is a problem with my <DropdownMenu> component, that is when I hover, or click on it, the background color of it, instead of the dark black I set, it just turn white. How can I fix it?
Answered by Dutch Smoushond
what you want is hover:bg-black hover:text-white
View full answer

22 Replies

alfonsus
have you forced the default theme to be dark? if so how did you do it?
@alfonsus have you forced the default theme to be dark? if so how did you do it?
sh1roOP
How would you force set the default theme to dark?
alfonsus
if you look at the ThemeProvider from next-themes, there is a prop that you can set it to dark
@alfonsus if you look at the ThemeProvider from next-themes, there is a prop that you can set it to dark
sh1roOP
I tried that… everything just turns white not as I expected. I just only want to see dark on my current ui…
alfonsus
wait what
@alfonsus wait what
sh1roOP
Idk how and why either!?
So I just don’t want this frontpage has any kind of lightmode here.
@sh1ro So I just don’t want this frontpage has any kind of lightmode here.
Dutch Smoushond
can you share your dropdown menu code
@sh1ro It's just the base `<DropdownMenu>` from https://ui.shadcn.com/docs/components/dropdown-menu
Dutch Smoushond
add classnames for trigger ig that will do it
@Dutch Smoushond add classnames for trigger ig that will do it
sh1roOP
How would you write the className?
@sh1ro How would you write the `className`?
Dutch Smoushond
something like this
do you want me to write the exact css classes?
@Dutch Smoushond something like this
sh1roOP
My problem is in the DropdownMenuSubTrigger, I did change the hover:text-white but nothing change.
Maybe like this?
@Dutch Smoushond do you want me to write the exact css classes?
sh1roOP
Wait a bit, lemme try other color.
make it black xd
@sh1ro My problem is in the `DropdownMenuSubTrigger`, I did change the `hover:text-white` but nothing change.
Dutch Smoushond
what you want is hover:bg-black hover:text-white
Answer
Now it's working.
Sorry for asking goofy ahh question.