From 592cc9b67c33587ba5caf228caadd0b9ef31a851 Mon Sep 17 00:00:00 2001
From: rebuilt <memoryman51@hotmail.com>
Date: Wed, 19 Mar 2025 13:58:12 -0700
Subject: [PATCH] ECP-106 : feat : Update formatting on data filters so that
 radio selectors are always on same row as text and allow text to wrap to the
 next line if there isn't enough room

---
 app/views/analyze/_data_filters.html.erb    | 24 ++++++++++-----------
 app/views/analyze/_group_selectors.html.erb |  2 +-
 app/views/analyze/index.html.erb            |  2 +-
 3 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/app/views/analyze/_data_filters.html.erb b/app/views/analyze/_data_filters.html.erb
index da0dfd0e..f1eecfa4 100644
--- a/app/views/analyze/_data_filters.html.erb
+++ b/app/views/analyze/_data_filters.html.erb
@@ -41,18 +41,18 @@
     <% end %>
 
       <% @presenter.slices.each do | slice |  %>
-        <div class="mx-3">
-          <input type="radio"
-                id="<%= slice.slug %>"
-                class="form-check-input"
-                name="graph"
-                value="<%= slice.graph.slug %>"
-                <%= slice.slug == @presenter.slice.slug ? "checked" : "" %>
-                <%= slice.slug == "all-data" ? "hidden" : "" %>>
-
-          <label for="<%= slice.slug %>"
-            <%= slice.slug == "all-data" ? "hidden" : "" %>>
-            <%= slice.to_s %></label>
+        <div class="d-flex flex-row mx-3">
+            <input type="radio"
+                  id="<%= slice.slug %>"
+                  class="form-check-input me-2"
+                  name="graph"
+                  value="<%= slice.graph.slug %>"
+                  <%= slice.slug == @presenter.slice.slug ? "checked" : "" %>
+                  <%= slice.slug == "all-data" ? "hidden" : "" %>>
+
+            <label class="text-break" for="<%= slice.slug %>"
+              <%= slice.slug == "all-data" ? "hidden" : "" %>>
+              <%= slice.to_s %></label>
         </div>
       <% end %>
     <% end %>
diff --git a/app/views/analyze/_group_selectors.html.erb b/app/views/analyze/_group_selectors.html.erb
index 5b85c945..8a8487a3 100644
--- a/app/views/analyze/_group_selectors.html.erb
+++ b/app/views/analyze/_group_selectors.html.erb
@@ -11,7 +11,7 @@
     <input type="hidden" id="year" name="<%= key  %>" value="<%= value %>">
   <% end %>
 
-  <select id="select-group" name="graph" class="mx-4 form-select" data-id="group-dropdown">
+  <select id="select-group" name="graph" class="ms-3 form-select" data-id="group-dropdown">
     <% @presenter.groups.each do |group| %>
       <option id="<%= group.slug %>" value="<%= group.graph.slug %>" <%= group.graph.slug == @presenter.graph.slug ? "Selected": "" %>><%= group.name %> </option>
     <% end %>
diff --git a/app/views/analyze/index.html.erb b/app/views/analyze/index.html.erb
index fddff83e..92598218 100644
--- a/app/views/analyze/index.html.erb
+++ b/app/views/analyze/index.html.erb
@@ -10,7 +10,7 @@
     <hr>
   </div>
   <div class="d-flex flex-row pt-5 row">
-    <div class="d-flex flex-column flex-grow-6 bg-color-white col-3 px-5" >
+    <div class="d-flex flex-column flex-grow-6 bg-color-white col-3 py-5 px-3" >
       <%= render partial: "focus_area", locals: {categories: @presenter.categories, district: @district, school: @school, academic_year: @academic_year, category: @presenter.category,  subcategories: @presenter.subcategories} %>
       <%= render partial: "school_years", locals: {available_academic_years: @presenter.academic_years, selected_academic_years: @presenter.selected_academic_years, district: @district, school: @school, academic_year: @academic_year, category: @presenter.category, subcategory: @presenter.subcategory, measures: @presenter.measures, graph: @presenter.graph} %>
       <%= render partial: "data_filters", locals: {district: @district, school: @school, academic_year: @academic_year, category: @presenter.category, subcategory: @presenter.subcategory} %>