After downloading a react multiselect component created by an individual, I installed it using npm install .... and incorporated the component in my react code with <MultiSelect .../>. The dropdown checkbox 'menu' is designed to allow users to select multiple options at once, but now I want to customize its appearance, such as changing the font color. Unfortunately, the creator of this component applied the color styling inline, making it difficult for me to modify it using CSS even after trying to wrap the component in a div container with a color: red style.
Additionally, I am facing another issue related to styling different elements within the dropdown menu. Specifically, I want to apply different colors to the Input field and the checkboxes that appear when the dropdown is activated, both of which are contained within a span with a specific className. Is there a method to assign distinct colors to these classNames for the installed components? I have yet to discover a solution to achieve this desired customization.
To clarify the layout of the dropdown menu, it begins with a clickable field where users can initiate the selection process, followed by the display of checkboxes upon activation. Upon selecting a checkbox, its name will be shown in the upper field. When closing the dropdown, only the names of selected checkboxes will remain visible in the field, each enclosed within a span container. My objective is to apply unique color schemes to the field and the displayed checkboxes to enhance the visual appeal of the multiselect component.
I appreciate any assistance or guidance you can provide on addressing these challenges.
Thank you for your help!