Move chart description to containing template

GeriLife · Dec 25, 2023 · 34a6147 · 34a6147
1 parent 8e7757d
commit 34a6147
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 17 deletions.
diff --git a/homes/templates/homes/home_detail.html b/homes/templates/homes/home_detail.html
@@ -2,15 +2,18 @@
 {% load i18n %}
 
 {% block content %}
-    <h1>{{ home.name }}</h1>
+    <div class="container">
+        <h1>{{ home.name }}</h1>
 
-    {% include "homes/home_residents_activity_percents.html" with data=home.resident_counts_by_activity_level_chart_data %}
+        <p>{% translate "Percent of residents by activity level" %}</p>
+        {% include "homes/home_residents_activity_percents.html" with data=home.resident_counts_by_activity_level_chart_data %}
 
-    <div class="container">
-        <div class="row mb-3">
-            <div class="col-md-4">
-                {% if home.current_residents %}
-                    <h2>{% translate "Current Residents" %}</h2>
+
+        {% if home.current_residents %}
+            <h2 class="mt-3">{% translate "Current Residents" %}</h2>
+
+            <div class="row mb-3">
+                <div class="col-md-5">
                     <ul class="list-group">
                         {% for resident in home.current_residents %}
                             <li class="list-group-item d-flex justify-content-between align-items-center">
@@ -21,9 +24,9 @@ <h2>{% translate "Current Residents" %}</h2>
                             </li>
                         {% endfor %}
                     </ul>
-                {% endif %}
+                </div>
             </div>
-        </div>
+        {% endif %}
 
         {% include "homes/home_detail_charts.html" %}
 

diff --git a/homes/templates/homes/home_group_list.html b/homes/templates/homes/home_group_list.html
@@ -5,19 +5,36 @@
 {% block content %}
     <h1>Homes</h1>
 
+    <p>{% translate "Homes showing the percent of residents by activity level" %}</p>
+
     {% for home_group in home_groups %}
-        <div class="card mb-2" style="width: 18rem;">
+        <div class="card mb-2">
             <div class="card-header">
                 <i class="bi bi-collection-fill"></i>
                 {{ home_group }}
             </div>
             <ul class="list-group list-group-flush">
                 {% for home in home_group.homes.all %}
                     <li class="list-group-item d-flex align-items-center">
-                        <i class="bi bi-house-heart-fill fs-3 me-2"></i>
-                        <a href="{{ home.get_absolute_url }}">
-                            {{ home }}
-                        </a>
+                        <div class="container">
+                            <div class="row">
+                                <div class="col-md-3">
+                                    <i class="bi bi-house-heart-fill fs-3 me-2"></i>
+                                    <a href="{{ home.get_absolute_url }}">
+                                        {{ home }}
+                                    </a>
+                                </div>
+
+                                {% if home.resident_counts_by_activity_level_chart_data %}
+                                    <div class="col-md-9">
+                                        <div class="mt-3">
+                                            {% include "homes/home_residents_activity_percents.html" with data=home.resident_counts_by_activity_level_chart_data %}
+                                        </div>
+                                    </div>
+                                {% endif %}
+                            </div>
+                        </div>
+
                     </li>
                 {% endfor %}
             </ul>
@@ -35,7 +52,9 @@ <h1>Homes</h1>
                 </div>
                 {% if home.resident_counts_by_activity_level_chart_data %}
                     <div class="col-md-9">
-                        {% include "homes/home_residents_activity_percents.html" with data=home.resident_counts_by_activity_level_chart_data %}
+                        <div class="mt-3">
+                            {% include "homes/home_residents_activity_percents.html" with data=home.resident_counts_by_activity_level_chart_data %}
+                        </div>
                     </div>
                 {% endif %}
             </div>

diff --git a/homes/templates/homes/home_residents_activity_percents.html b/homes/templates/homes/home_residents_activity_percents.html
@@ -1,5 +1,3 @@
-{% load i18n %}
-<p>{% translate "Percent of residents by activity level" %}</p>
 <div class="bar-container">
     {% for item in data %}
         <span