更改 select2 颜色

Question

How can i change the color of the following items:

1.) The color of the field that appears after the page is loaded (I would apply in the classic form bg-white )

2.)The color of the text that appears after the page is loaded (I would apply in the classic form text-dark )

3.)Font color and element color when hovering over the mouse

4.)Color of the field for entering text

5.)The color of the first option below the text

I found a very useful answer on the forum - source

/* Input field */
.select2-selection__rendered {  }

/* Around the search field */
.select2-search {  }

/* Search field */
.select2-search input {  }

/* Each result */
.select2-results {  }

/* Higlighted (hover) result */
.select2-results__option--highlighted {  }

/* Selected option */
.select2-results__option[aria-selected=true] {  }

But in my situation it does not help to change the color of the elements I have placed above.

Are the changes I wrote about possible, if not what are the alternative solutions?

Answer 1

I believe what you want and need is a different theme on your select2. You probably have set some theme somewhere in your code, as the default theme is afaik exactly what you want

Please follow documentation here to change the theme:

https://select2.org/configuration/defaults

This might be also interesting

https://select2.org/appearance