From 433e7c50dea402a0d0a92643408a3bd375014192 Mon Sep 17 00:00:00 2001
From: Gabe Farrell <gabe@mnrva.dev>
Date: Thu, 22 Jun 2023 05:00:26 +0000
Subject: [PATCH] Add hovers to browse page response rates

---
 .../categories/_subcategory_section.html.erb  | 24 ++++++++++++++++---
 1 file changed, 21 insertions(+), 3 deletions(-)

diff --git a/app/views/categories/_subcategory_section.html.erb b/app/views/categories/_subcategory_section.html.erb
index f90349e2..3453e50c 100644
--- a/app/views/categories/_subcategory_section.html.erb
+++ b/app/views/categories/_subcategory_section.html.erb
@@ -11,15 +11,33 @@
         <p class="body-large "><%= subcategory.description %></p>
 
         <div class="d-flex justify-content-start">
-          <div class="body-large text-center response-rate">
+          <div 
+            class="body-large text-center response-rate"
+            data-bs-toggle="popover"
+            data-bs-trigger="hover focus"
+            data-bs-content="The number of publicly available school data sources, often collected from the MA Department of Elementary and Secondary Education."
+            data-bs-placement="bottom"
+          >
           <p class="response-rate-percentage"><%= subcategory.admin_collection_rate.first %> / <%= subcategory.admin_collection_rate.last %></p>
             <p>school admin data sources</p>
           </div>
-          <div class="body-large mx-3 text-center response-rate">
+          <div 
+            class="body-large mx-3 text-center response-rate"
+            data-bs-toggle="popover"
+            data-bs-trigger="hover focus"
+            data-bs-content="The student survey response rate for this sub-category. This number differs from the overall response rate because each individual student receives 44 of 66 total questions, in order to avoid survey fatigue."
+            data-bs-placement="bottom"
+          >
             <p class="response-rate-percentage"><%= subcategory.student_response_rate %></p>
             <p>of students responded</p>
           </div>
-          <div class="body-large text-center response-rate">
+          <div 
+            class="body-large text-center response-rate"
+            data-bs-toggle="popover"
+            data-bs-trigger="hover focus"
+            data-bs-content="The teacher survey response rate for this sub-category. This number differs from the overall response rate because the survey includes skip logic to limit the number of questions for each individual survey respondent."
+            data-bs-placement="bottom"
+          >
             <p class="response-rate-percentage"><%= subcategory.teacher_response_rate %></p>
             <p>of teachers responded</p>
           </div>