Ändern von Farben und Styling von collection_select dropdown mit Rails bootstrap und select2 implementiert

Question

Ich möchte die Farben ändern und style ein Dropdown-Menü in Rails, um den Rest meiner Web-App-Styling. Ich benutze Rails, Bootstrap und select2 und ich habe keine Ahnung, wo ich css hinzufügen kann und wie ich überhaupt auf die verschiedenen Teile des Drop-downs zugreifen kann, damit ich sie farblich anpassen und mit dem Rest des Designs der App anpassen kann .

dies ist die Umsetzung der Drop-Down-

<%= collection_select(:id, :name, @product, :id, :name,{:include_blank => true},{class: "js-example-basic-single" }) %> 

Bitte geben Sie mir, wie dieses Element zu erreichen, Styling, danke.

Answer 1

Ich bin mir nicht sicher, was Ihre Frage ist, also werde ich versuchen, es so gut wie möglich zu beantworten. Ich glaube, Sie sollten Ihr CSS zur application.css-Datei hinzufügen, die sich unter app \ assets \ stylesheets befinden sollte. Dann, wenn Sie alle Ihre Drop-downs die gleichen anpassen möchten, können Sie das select Tag in CSS verwenden. Hier ist ein Beispiel

select { 
 
    position: relative; 
 
    display: inline-block; 
 
    cursor: pointer; 
 
    text-align: center; 
 
    text-decoration: none; 
 
    font-family: Arial, Helvetica, sans-serif; 
 
    border-radius: 3px; 
 
    border: none; 
 
    background: #f1f1f1; 
 
    padding: 2px; 
 
} 
 
    
 
select:hover { 
 
    background-color: dodgerblue; 
 
}

<select> 
 
    <option value="volvo">Volvo</option> 
 
    <option value="saab">Saab</option> 
 
    <option value="mercedes">Mercedes</option> 
 
    <option value="audi">Audi</option> 
 
</select>