css - 单击单选按钮时标签颜色更改

Question

我在带有两个单选按钮的轨道中使用简单的形式。我希望在选中单选按钮/标签时隐藏单选按钮并更改标签颜色。然而，目前我唯一能让它工作的方法是单选按钮是否可见，当它被点击时，标签会改变颜色。单选按钮的 for 和 id 相同，所以这不是问题所在。我不确定这个问题。谢谢

<div class="modal-flex">
        <%= f.radio_button "refund_#{invoice.id}", :credit_note, class: "radio-refund" %>
        <%= f.label "refund_#{invoice.id}_credit_note", t(".refund_credit_note"), class: "modal-options refund"%>
        <%= f.radio_button "refund_#{invoice.id}", :only, class: "radio-refund" %>
        <%= f.label "refund_#{invoice.id}_only", t(".refund_only"), class: "modal-options refund" %>
      </div>

  input[type="radio"] + label:before {
    display: none;
  }

 input[type="radio"]:checked + label:after {
    background-color: $color-gray
  }

Answer 1

修复了更多的 scss。语法错误