From 3d651cd74507e5cf87f39e08b94b7492766aa893 Mon Sep 17 00:00:00 2001
From: Étienne Loks <etienne.loks@iggdrasil.net>
Date: Fri, 15 Sep 2023 14:58:46 +0200
Subject: 💄 better layout of import tables
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ishtar_common/templates/ishtar/import_table.html | 123 +++++++++++++----------
 1 file changed, 70 insertions(+), 53 deletions(-)

(limited to 'ishtar_common')

diff --git a/ishtar_common/templates/ishtar/import_table.html b/ishtar_common/templates/ishtar/import_table.html
index 62545f5a3..9aef388b9 100644
--- a/ishtar_common/templates/ishtar/import_table.html
+++ b/ishtar_common/templates/ishtar/import_table.html
@@ -49,12 +49,12 @@
         </tr>
         {% for import in object_list %}
         <tr id="import-{{import.import_id}}"
-             class='import-row{% if import.error_file %}-error{% endif %}{% if import.pk in refreshed_pks %} bg-info{% endif %}'>
-            <td>
-                <strong>{{import.name|default:"-"}}</strong><br>
-                <small><i class="fa fa-calendar" aria-hidden="true"></i>&nbsp; {{import.creation_date|date:"DATE_FORMAT"}} {{import.creation_date|time:"H:i"}} - {% if import.end_date %}{{import.end_date|date:"DATE_FORMAT"}} {{import.end_date|time:"H:i"}}{% endif %}</small><br>
-                <small><i class="fa fa-user" aria-hidden="true"></i>&nbsp; {{import.user}}</small>
-            </td>
+             class='import-row{% if import.error_file or not import.pre_import_form_is_valid %}-error{% endif %}{% if import.pk in refreshed_pks %} bg-info{% endif %}'>
+            <td><ul class="simple">
+                <li><strong>{{import.name|default:"-"}}</strong></li>
+                <li><small><i class="fa fa-fw fa-calendar" aria-hidden="true"></i>&nbsp; {{import.creation_date|date:"DATE_FORMAT"}} {{import.creation_date|time:"H:i"}} - {% if import.end_date %}{{import.end_date|date:"DATE_FORMAT"}} {{import.end_date|time:"H:i"}}{% endif %}</small></li>
+                <li><small><i class="fa fa-fw fa-user" aria-hidden="true"></i>&nbsp; {{import.user}}</small></li>
+            </ul></td>
             <td>
                 {{import.importer_type}} ({% if import.importer_type.type_label %}{% trans import.importer_type.type_label %}{% else %}{% trans "Group" %}{% endif %})
             </td>
@@ -71,36 +71,39 @@
                     {% endfor%}
                 </select>
             </td>
-            <td>
-                {% if import.imported_file %}
-                <a href='{{import.imported_file.url}}'>{% trans "Source" %}</a>
-                {% if import.imported_images %}
-                - <a href="{{ import.imported_images.url }}">{% trans "Media" %}</a>
-                {% endif %}
-                {% elif import.archive_file %}
-                <a href='{{import.archive_file.url}}'>{% trans "Archive" context "name" %}</a>
-                {% endif %}
-            </td>
-            <td>
-                {% if import.has_pre_import_form %}
-                {% if not import.pre_import_form_is_valid %}
-                    <i class="text-danger fa fa-exclamation-triangle" aria-hidden="true"></i>
-                {% endif %}
-                <a href='{% url "import_pre_import_form" import.pk %}'>{% trans "Pre-import values" %}</a><br>
-                {% endif %}
-                {% if import.need_matching %}
-                <a href='{% url "import_link_unmatched" import.pk %}'>{% trans "Make match" %}</a>
-                {% endif %}
-            </td>
-            <td style="white-space: nowrap;">{% if import.error_file %}
-                <i class="text-danger fa fa-exclamation-triangle" aria-hidden="true"></i> <a href='{{import.error_file.url}}'>{% trans "Error" %}</a>
-                <br>{% endif %}
-            {% if import.result_file %}
-                <a href='{{import.result_file.url}}'>{% trans "Result" %}</a>
-                <br>{% endif %}
-            {% if import.match_file %}
-                <a href='{{import.match_file.url}}'>{% trans "Match" %}</a>
-                {% endif %}
+            <td><ul class="simple">
+                {% if import.imported_file %}<li>
+                    <i class="fa fa-fw fa-file-text-o" aria-hidden="true"></i> <a href='{{import.imported_file.url}}'>{% trans "Source" %}</a>
+                </li>
+                {% if import.imported_images %}<li>
+                    <i class="fa fa-fw fa-file-image-o" aria-hidden="true"></i> <a href="{{ import.imported_images.url }}">{% trans "Media" %}</a>
+                </li>{% endif %}
+                {% elif import.archive_file %}<li>
+                    <i class="fa fa-fw fa-file-archive-o" aria-hidden="true"></i> <a href='{{import.archive_file.url}}'>{% trans "Archive" context "name" %}</a>
+                </li>{% endif %}
+            </ul></td>
+            <td><ul class="simple">
+                {% if import.has_pre_import_form %}<li>
+                    {% if not import.pre_import_form_is_valid %}
+                    <i class="text-danger fa fa-fw fa-exclamation-triangle" aria-hidden="true"></i>
+                    {% else %}
+                    <i class="fa fa-fw fa-check-square-o" aria-hidden="true"></i>
+                    {% endif %}
+                    <a href='{% url "import_pre_import_form" import.pk %}'>{% trans "Pre-import values" %}</a>
+                </li>{% endif %}
+                {% if import.need_matching %}<li>
+                    <i class="fa fa-fw fa-arrows-h" aria-hidden="true"></i> <a href='{% url "import_link_unmatched" import.pk %}'>{% trans "Make match" %}</a>
+                </li>{% endif %}
+            </ul></td>
+            <td style="white-space: nowrap;"><ul class="simple">{% if import.error_file %}<li>
+                <i class="text-danger fa fa-fw fa-exclamation-triangle" aria-hidden="true"></i> <a href='{{import.error_file.url}}'>{% trans "Error" %}</a>
+            </li>{% endif %}
+            {% if import.result_file %}<li>
+                 <i class="fa fa-fw fa-th" aria-hidden="true"></i> <a href='{{import.result_file.url}}'>{% trans "Result" %}</a>
+            </li>{% endif %}
+            {% if import.match_file %}<li>
+                <i class="fa fa-fw fa-arrows-h" aria-hidden="true"></i> <a href='{{import.match_file.url}}'>{% trans "Match" %}</a>
+            </li>{% endif %}</ul>
             </td>
         </tr>
         {% if import.importer_type.type_label %}
@@ -123,24 +126,38 @@
             <td>{{sub.importer_type}}</td>
             <td id="status-{{sub.import_id}}">{{sub.status}}</td>
             <td></td>
-            <td>{% if sub.imported_file %}
-                <a href='{{sub.imported_file.url}}'>{% trans "Source" %}</a>
-                {% if sub.imported_images %}
-                - <a href="{{ sub.imported_images.url }}">{% trans "Media" %}</a>
-                {% endif %}
-            {% endif %}</td>
-            <td>{% if sub.need_matching %}
-                <a href='{% url "import_link_unmatched" sub.pk %}'>{% trans "Make match" %}</a>
-            {% endif %}</td>
-            <td style="white-space: nowrap;">{% if sub.error_file %}
-                <i class="text-danger fa fa-exclamation-triangle" aria-hidden="true"></i> <a href='{{sub.error_file.url}}'>{% trans "Error" %}</a>
-                <br>{% endif %}
-            {% if sub.result_file %}
-                <a href='{{sub.result_file.url}}'>{% trans "Result" %}</a>
-                <br>{% endif %}
-            {% if sub.match_file %}
-                <a href='{{sub.match_file.url}}'>{% trans "Match" %}</a>
+            <td><ul class="simple">
+                {% if sub.imported_file %}<li>
+                    <i class="fa fa-fw fa-file-text-o" aria-hidden="true"></i> <a href='{{sub.imported_file.url}}'>{% trans "Source" %}</a>
+                </li>{% endif %}
+                {% if sub.imported_images %}<li>
+                    <i class="fa fa-fw fa-file-image-o" aria-hidden="true"></i> <a href="{{ sub.imported_images.url }}">{% trans "Media" %}</a>
+                </li>{% endif %}
+            </ul></td>
+            <td><ul class="simple">
+                {% if sub.has_pre_import_form %}<li>
+                {% if not sub.pre_import_form_is_valid %}
+                <i class="text-danger fa fa-fw fa-exclamation-triangle" aria-hidden="true"></i>
+                {% else %}
+                <i class="fa fa-fw fa-check-square-o" aria-hidden="true"></i>
                 {% endif %}
+                <a href='{% url "import_pre_import_form" sub.pk %}'>{% trans "Pre-import values" %}</a>
+            </li>{% endif %}
+            {% if sub.need_matching %}<li>
+                <i class="fa fa-fw fa-arrows-h" aria-hidden="true"></i> <a href='{% url "import_link_unmatched" sub.pk %}'>{% trans "Make match" %}</a>
+            </li>{% endif %}
+            </ul></td>
+            <td style="white-space: nowrap;"><ul class="simple">
+            {% if sub.error_file %}<li>
+                <i class="text-danger fa fa-fw fa-exclamation-triangle" aria-hidden="true"></i> <a href='{{sub.error_file.url}}'>{% trans "Error" %}</a>
+            </li>{% endif %}
+            {% if sub.result_file %}<li>
+                <i class="fa fa-fw fa-th" aria-hidden="true"></i> <a href='{{sub.result_file.url}}'>{% trans "Result" %}</a>
+            </li>{% endif %}
+            {% if sub.match_file %}<li>
+                <i class="fa fa-fw fa-arrows-h" aria-hidden="true"></i> <a href='{{sub.match_file.url}}'>{% trans "Match" %}</a>
+            </li>{% endif %}
+            </ul>
             </td>
         </tr>
         <tr></tr>{# only for even and odd style #}
-- 
cgit v1.2.3