0001-Redesigned-date-list-page.patch

From e41bd81df3679ee9d23b7959fc7d4f1325bdabb4 Mon Sep 17 00:00:00 2001
From: unknown <santosh.2@iitj.ac.in>
Date: Sat, 10 Sep 2022 20:54:11 +0530
Subject: [PATCH] Redesigned date list page

---
 .../mailarchives/templates/datelist.html      | 43 +++++++-----
 .../templates/datelist_topandbottom.html      | 21 ++++--
 django/media/css/main.css                     | 67 +++++++++++++++++++
 3 files changed, 107 insertions(+), 24 deletions(-)

diff --git a/django/archives/mailarchives/templates/datelist.html b/django/archives/mailarchives/templates/datelist.html
index df0fb50..0af3df1 100644
--- a/django/archives/mailarchives/templates/datelist.html
+++ b/django/archives/mailarchives/templates/datelist.html
@@ -10,35 +10,42 @@
 {%include "searchform.html"%}
 
 {%include "datelist_topandbottom.html"%}
-
 {%for m in messages%}
   {%ifchanged m.date.date%}
     {%if not forloop.first%}
-        </tbody>
+      </tbody>
       </table>
     {%endif%}
     <h2>{{m.date.date}}</h2>
-    <table class="table table-striped table-sm thread-list">
-      <thead>
+    <table
+      id="table"
+      data-toggle="table"
+      data-pagination="true"
+      data-pagination-v-align="top"
+      data-page-size="All"
+      data-page-list="[All, 10, 20, 50, 100]"
+      data-buttons-class="primary"
+      data-search="true">
+      <thead class="list-header">
         <tr>
-          <th scope="col" style="width: 70%;">Thread</th>
-          <th scope="col" style="width: 25%;">Author</th>
-          <th scope="col" style="width: 5%;">Time</th>
+          <th scope="col" style="width: 60%;" class="list-table-header-text" data-field="threadname">Thread</th>
+          <th scope="col" style="width: 30%;" class="list-table-header-text" data-field="threadauthor"><i class="fa fa-user" aria-hidden="true" style="color: #ffffff;"></i> Author</th>
+          <th scope="col" style="width: 10%;" class="list-table-header-text" data-field="threadtime"><i style="color: #ffffff;" class="fa">&#xf017;</i> Time</th>
         </tr>
       </thead>
       <tbody>
   {%endifchanged%}
-  <tr>
-    <th scope="row">
-      <a href="/message-id/{{m.messageid|urlencode}}">{{m.subject|default:"[No subject]"}}{% if m.has_attachment %} &#x1f4ce;{% endif %}</a>
-    </th>
-    <td>{{m.mailfrom|nameonly}}</td>
-    <td>{{m.date.time|time:"H:i"}}</td>
-  </tr>
-  {%if forloop.last%}
-      </tbody>
-    </table>
-  {%endif%}
+      <tr class="daylist_data">
+        <th style="padding: 3px;">
+          <a href="/message-id/{{m.messageid|urlencode}}">{{m.subject|default:"[No subject]"}} {% if m.has_attachment %} &#x1f4ce;{% endif %}</a>
+        </th>
+        <td style="text-align: center;">{{m.mailfrom|nameonly}}</td>
+        <td style="text-align: center;">{{m.date.time|time:"H:i"}}</td>
+      </tr>
+      {%if forloop.last%}
+    </tbody>
+  </table>
+{%endif%}
 {%endfor%}
 
 {%include "datelist_topandbottom.html"%}
diff --git a/django/archives/mailarchives/templates/datelist_topandbottom.html b/django/archives/mailarchives/templates/datelist_topandbottom.html
index 097f138..d8b4c6e 100644
--- a/django/archives/mailarchives/templates/datelist_topandbottom.html
+++ b/django/archives/mailarchives/templates/datelist_topandbottom.html
@@ -1,14 +1,23 @@
 {%if messages%}
 <h3>Browse Archives</h3>
+<nav aria-label="...">
+<ul class="pagination" style="padding-left: 0px; margin-bottom: 15px;">
 {%with messages|first as firstmsg%}
-<a href="/list/{{list.listname}}/before/{{firstmsg.shortdate}}">Prev</a>
+<a class="daylinks-pagination-prev" href="/list/{{list.listname}}/before/{{firstmsg.shortdate}}" tabindex="-1"><i class="fa fa-angle-double-left" aria-hidden="true"></i> Prev </a>
 {%endwith%}
-|
 {%with messages|last as lastmsg%}
-<a href="/list/{{list.listname}}/since/{{lastmsg.shortdate}}">Next</a>
+<a class="daylinks-pagination-next" href="/list/{{list.listname}}/since/{{lastmsg.shortdate}}"> Next <i class="fa fa-angle-double-right" aria-hidden="true"></i></a>
 {%endwith%}
-{%endif%}
-
+</ul>
+</nav>
+{%endif%} 
 {%if daysinmonth%}
-<div class="daylinks">Jump to day: {%for d in daysinmonth%}<a href="/list/{{list.listname}}/since/{{yearmonth}}{{d|stringformat:"02d"}}0000/">{{d}}</a> {%endfor%}</div>
+<div class="daylinks">
+    <p>Jump to day: </p>
+    <div class="daylist_pagination">
+    {%for d in daysinmonth%}
+        <a class="daylink_pagination" href="/list/{{list.listname}}/since/{{yearmonth}}{{d|stringformat:"02d"}}0000/">{{d}}</a> 
+    {%endfor%}
+    </div>
+</div>
 {%endif%}
diff --git a/django/media/css/main.css b/django/media/css/main.css
index b8acb29..280a9c1 100644
--- a/django/media/css/main.css
+++ b/django/media/css/main.css
@@ -164,6 +164,72 @@ hr {
   margin: 1em 0 2em 0;
 }
 
+/** Day Links */
+.daylinks-pagination-prev {
+  color: #326690 !important;
+  padding: 7px;
+  border: 1px solid #9e9d9d;
+  border-radius: 8px 0px 0px 8px;
+  margin-right: 3px;
+  font-size: 12px;
+}
+
+.daylinks-pagination-prev:hover {
+  color: #ffffff !important;
+  background-color: #326690;
+}
+
+
+.daylinks-pagination-prev:hover i {
+  color: #ffffff !important;
+}
+
+.daylinks-pagination-next {
+  color: #326690 !important;
+  padding: 7px;
+  border: 1px solid #9e9d9d;
+  border-radius: 0px 8px 8px 0px;
+  font-size: 12px;
+}
+
+.daylinks-pagination-next:hover {
+  color: #ffffff !important;
+  background-color: #326690;
+}
+
+.daylinks-pagination-next:hover i {
+  color: #ffffff !important;
+}
+
+.daylist_pagination {
+  display: inline-block;
+}
+
+.daylink_pagination {
+  background: #f1f3f4;
+  text-align: center;
+  border: 1px solid #9e9d9d;
+  color: #326690 !important;
+  float: left;
+  padding: 6px;
+  margin: 3px;
+  text-decoration: none;
+}
+
+.daylink_pagination:hover {
+  color: white !important;
+  background-color: #326690;
+}
+
+.datalist_data th, td {
+  padding: 0px;
+  font-size: 12px;
+}
+
+.daylist_data:hover {
+  background-color: #efefef !important;
+}
+
 .page-item.active .page-link {
   z-index: 1;
   color: #fff;
@@ -263,6 +329,7 @@ hr {
   display: flex;
   align-items: center;
   justify-content: space-between;
+  flex-wrap: wrap;
 }
 
 .pagination .page-link {
-- 
2.26.2.windows.1