Fix labels in progress bar percentage selection

We were using the same label for two elements, but the label was only assigned to one of them.
2024-10-10 21:30:09 +02:00
parent 233ba3c72f
commit 9f738b8d5f
2 changed files with 25 additions and 2 deletions
--- a/app/components/admin/progress_bars/form_component.html.erb
+++ b/app/components/admin/progress_bars/form_component.html.erb
@@ -16,12 +16,13 @@
    <% end %>
  </div>

-  <div class="row">
+  <div class="row percentage-inputs">
    <div class="small-12 medium-6 large-2 column">
-      <%= f.label :percentage %>
+      <%= f.label :percentage, nil, id: "percentage_label" %>
      <%= f.text_field :percentage, { type: :range,
                                      id: "percentage_range",
                                      label: false,
+                                      "aria-labelledby": "percentage_label",
                                      class: "column" }.merge(progress_options) %>
    </div>