[Bug] The Options in Select (Form Select) are invisible in dark mode if "custom-select" or "form-control" is used.

[t3chn0tr0n]

Version

Black Dashboard React v1.0.0 based on Black Dashboard - v1.0.0

Reproduction link

https://demos.creative-tim.com/black-dashboard-react/#/documentation/forms

Steps to reproduce

Select 1 2

Now open in browser and see the problem.

What is expected?

All options should be visible without hovering over them.

What is actually happening?

Options are not visible without hover over.

---

Solution

Additional comments

[einazare]

Hello there @t3chn0tr0n ,

Thank you for your interest in working with our products.
It seems to me that the selects is working as expected, in both dark and white mode:

Please provide some more details on the problem.

Best,
Manu

[its-tn10]

@einazare
I'm not the original person who posted the question, but I've encountered the same issue as well.
I'm currently using the latest version of Firefox on Windows 10, and the documentation for this theme (provided in the first post already) and my environment for development encounters this issue.

[einazare]

Hello there, @t3chn0tr0n , @its-tn10 ,

@its-tn10 , thank you for providing your browser version and OS. I checked and indeed on Windows, the options inside the select are not visible.
To solve it, just add the following code inside your css:

select.form-control option {
   color: #888;
}

Let me know if that worked.

Best,
Manu

[its-tn10]

Yep, the text color changed to a light-grey color and it now works as it should. Thanks!

[t3chn0tr0n]

Yay its fixed now.
Btw, This dashboard is a great job done!

[einazare]

Hello again, guys,

I will leave this issue opened until I will make a new updated on this product so that I won't forget about it.

Thank you,
Manu

[t3chn0tr0n]

okay, no problem.