Match tom select and bootstrap color?

Question

I'm just switch from basic bootstrap 5 select to tom select, but I'm not able to match the colors of the buttons.

This is what it looks like, on the left side is the old bootstrap 5 drop, on the right side is tom select. Color for the select is "btn-outline-secondary".

Example image

Any help would be appreciated!

Was expecting the buttons to have the same border and text color

Answer 1

I found that if you remove the "form-select" class from the tom-select element it should render bootstrap css correctly:

document.getElementById("your_tom_element").classList.remove('form-select');

however, this is a fairly dirty solution in case you need something quick. I would investigate whether this solution solves your problem, and then see whether some of the bootstrap classes collide with the tom-select classes.

Maybe try to provide also a bit more information regarding your block of code that is problematic.