From c470864c86d94697056c78f7c2c61de8faf4337e Mon Sep 17 00:00:00 2001
From: Scot Hacker <shacker@birdhouse.org>
Date: Fri, 16 Mar 2018 00:25:18 -0700
Subject: [PATCH] Bootstrap 4  in list_lists

---
 todo/templates/todo/list_lists.html | 17 +++++++++--------
 1 file changed, 9 insertions(+), 8 deletions(-)

diff --git a/todo/templates/todo/list_lists.html b/todo/templates/todo/list_lists.html
index 3256b70..47d710d 100644
--- a/todo/templates/todo/list_lists.html
+++ b/todo/templates/todo/list_lists.html
@@ -6,22 +6,23 @@
 
    <h1>Todo Lists</h1>
 
-   <p>{{ item_count }} items in {{ list_count }} lists</p>
+   <p>{{ item_count }} items in {{ list_count }} list{{ list_count|pluralize }}</p>
 
    	{% regroup lists by group as section_list %}
 
     {% for group in section_list %}
-        <h3>{{ group.grouper }}</h3>
-        <ul>
+        <h3>Group: {{ group.grouper }}</h3>
+        <ul class="list-group">
             {% for item in group.list %}
-   	            <li>
-                  <a href="{% url 'todo:list_detail' item.id item.slug %}">{{ item.name }}</a>
-                    ({{ item.list_detail.count }}/{{ item.item_set.count }})
+                <li class="list-group-item d-flex justify-content-between align-items-center">
+                    <a href="{% url 'todo:list_detail' item.id item.slug %}">{{ item.name }}</a>
+                <span class="badge badge-primary badge-pill">{{ item.item_set.count }}</span>
                 </li>
             {% endfor %}
-        </ul>
+
+          </ul>
     {% endfor %}
 
-    <p><a href="{% url 'todo:add_list' %}">Create new todo list</a></p>
+    <div class="mt-3"><a href="{% url 'todo:add_list' %}" class="btn btn-primary">Create new todo list</a></div>
 
 {% endblock %}