如何以 sass 格式设置由 simple_form 生成的 select 元素的样式?
How to style a select element generated by simple_form in sass format?
我有这个simple_form:
.reveal.doubt id="doubt-material-#{material.id}" data-reveal=true
button.close-button data-close=true aria-label="Close reveal" type="button"
span aria-hidden="false" ×
h5 #{t 'students.materials.index.questions.button'}
p #{t 'students.materials.index.questions.form_explanation'}
= simple_form_for [:student, trail, component, material, material_student, doubt], html: {id: "doubt" }, remote: true do |f|
= f.input :recipient, collection: [['contato@witseed.com','Atendimento a cliente'],['tec@witseed.com','Suporte técnico']],value_method: :first, label_method: :second, label: "#{t 'students.materials.index.questions.form_send_email'}", include_blank: "#{t 'students.materials.index.questions.form_blank_line'}", required: true, input_html: {class: 'custom_select'}
= f.input :question, as: :text, label: true, label: "#{t 'students.materials.index.questions.form_message'}" , input_html: { rows: "2" }
= f.submit "#{t 'students.materials.index.questions.form_send_button'}", class: 'button primary-button-active'
它生成下面的html:
生成以下表格:
现在我想设置下拉菜单的样式,但我无法在代码中找到 select 元素。在检查时,我很清楚它在哪里。
我尝试添加:
.input
position: relative
select
background-color: white
&#doubt_recipient
border: 2px solid red
padding: 5px
但是失败了。
有人有什么建议吗?非常感谢。
实际上只是 运行 终端下面一行的问题:
bundle exec rake assets:precompile
并呈现 CSS 样式。
最后我刚刚在id处添加了样式:
#doubt_recipient
border: 2px solid red
padding: 5px
background-color: white
我有这个simple_form:
.reveal.doubt id="doubt-material-#{material.id}" data-reveal=true
button.close-button data-close=true aria-label="Close reveal" type="button"
span aria-hidden="false" ×
h5 #{t 'students.materials.index.questions.button'}
p #{t 'students.materials.index.questions.form_explanation'}
= simple_form_for [:student, trail, component, material, material_student, doubt], html: {id: "doubt" }, remote: true do |f|
= f.input :recipient, collection: [['contato@witseed.com','Atendimento a cliente'],['tec@witseed.com','Suporte técnico']],value_method: :first, label_method: :second, label: "#{t 'students.materials.index.questions.form_send_email'}", include_blank: "#{t 'students.materials.index.questions.form_blank_line'}", required: true, input_html: {class: 'custom_select'}
= f.input :question, as: :text, label: true, label: "#{t 'students.materials.index.questions.form_message'}" , input_html: { rows: "2" }
= f.submit "#{t 'students.materials.index.questions.form_send_button'}", class: 'button primary-button-active'
它生成下面的html:
生成以下表格:
现在我想设置下拉菜单的样式,但我无法在代码中找到 select 元素。在检查时,我很清楚它在哪里。
我尝试添加:
.input
position: relative
select
background-color: white
&#doubt_recipient
border: 2px solid red
padding: 5px
但是失败了。
有人有什么建议吗?非常感谢。
实际上只是 运行 终端下面一行的问题:
bundle exec rake assets:precompile
并呈现 CSS 样式。
最后我刚刚在id处添加了样式:
#doubt_recipient
border: 2px solid red
padding: 5px
background-color: white