From 4c13d0ea5f429d2361e04ef013d65f28c29af2ac Mon Sep 17 00:00:00 2001
From: Aurélien Bompard <aurelien@bompard.org>
Date: Thu, 14 Nov 2013 17:49:47 +0100
Subject: Improve front page appearance

---
 hyperkitty/templates/index.html | 60 ++++++++++++++++++++++++++++++++---------
 1 file changed, 47 insertions(+), 13 deletions(-)

(limited to 'hyperkitty/templates/index.html')

diff --git a/hyperkitty/templates/index.html b/hyperkitty/templates/index.html
index 78804e1..357bde6 100644
--- a/hyperkitty/templates/index.html
+++ b/hyperkitty/templates/index.html
@@ -15,30 +15,59 @@
 <div class="span2 lists-menu">
     <h2>{% trans 'Lists' %}</h2>
     <ul>
-        <li><a href="{% url 'root' %}">All</a></li>
-        <li><a href="{% url 'root' %}?sort=active">Most active</a></li>
-        <li><a href="{% url 'root' %}?sort=popular">Most popular</a></li>
+        <li>
+            {% if not sort_mode %}
+            <span class="active">{% trans 'All' %}</span>
+            {% else %}
+            <a href="{% url 'root' %}">{% trans 'All' %}</a>
+            {% endif %}
+        </li>
+        <li>
+           {% if sort_mode == "active" %}
+           <span class="active">{% trans 'Most active' %}</span>
+           {% else %}
+           <a href="{% url 'root' %}?sort=active">{% trans 'Most active' %}</a>
+           {% endif %}
+        </li>
+        <li>
+           {% if sort_mode == "popular" %}
+           <span class="active">{% trans 'Most popular' %}</span>
+           {% else %}
+            <a href="{% url 'root' %}?sort=popular">{% trans 'Most popular' %}</a>
+           {% endif %}
+        </li>
     </ul>
 </div>
 
 <div class="span10">
 
-<h1>{% trans 'Available lists' %}</h1>
+<h1>
+    {% trans 'Available lists' %}
+    {% if sort_mode == 'active' %}
+        <small>({% trans 'most active first' %})</small>
+    {% elif sort_mode == 'popular' %}
+        <small>({% trans 'most popular first' %})</small>
+    {% endif %}
+</h1>
 
 {% if all_lists %}
 <table class="lists table">
     <thead>
-        <tr><th>List</th><th>Description</th><th>Activity in the past 30 days</th></tr>
+        <tr>
+            <th>{% trans 'List' %}</th>
+            <th>{% trans 'Description' %}</th>
+            <th>{% trans 'Activity in the past 30 days' %}</th>
+        </tr>
     </thead>
     <tbody>
 {% for mlist in all_lists %}
-        <tr
+        <tr class="list
            {% if mlist.is_private %}
-           class="private"
+           private
            {% elif mlist.recent_threads_count == 0 %}
-           class="inactive"
+           inactive
            {% endif %}
-           >
+           ">
             <td>
                 <a href="{% url 'list_overview' mlist_fqdn=mlist.name %}"
                    class="list-name">
@@ -54,12 +83,13 @@
                <span class="list-tags">inactive</span>
                {% endif %}
                 <br />
-                <a href="{% url 'list_overview' mlist_fqdn=mlist.name %}"
-                   class="list-address">
+                <span class="list-address">
                     {{ mlist.name }}
-                </a>
+                </span>
+            </td>
+            <td class="list-description">
+                {{ mlist.description|default_if_none:"" }}
             </td>
-            <td class="list-description"></td>
             <td class="activity">
                 <div class="chart" data-chart-values="{{ mlist.evolution|to_json }}"></div>
                 <ul class="list-stats">
@@ -80,6 +110,7 @@
                 </ul>
             </td>
         </tr>
+        <tr class="spacer"><td colspan="3"></td></tr>
 {% endfor %}
     </tbody>
 </table>
@@ -104,6 +135,9 @@
                   $.parseJSON($(this).attr("data-chart-values")),
                   {height: 30});
         });
+        $("table.lists tr.list").click(function(e) {
+            document.location.href = $(this).find("a.list-name").attr("href");
+        });
     });
 </script>
 
-- 
cgit