downloads: Redesign file listing

Signed-off-by: Michael Tremer <michael.tremer@ipfire.org>

diff --git a/src/templates/download/release.html b/src/templates/download/release.html
index c2baf23afbb4373d2038b75e6179389563c39fd0..99eeb59c2c76f41ef1b19c9f9f11c63b28e65ea2 100644 (file)
--- a/src/templates/download/release.html
+++ b/src/templates/download/release.html
@@ -26,35 +26,36 @@
                                {% end %}
                        </p>
 
-                       <div class="list-group">
-                               {% for i, arch in enumerate(release.arches) %}
-                                       <div class="list-group-item bg-dark text-white d-flex align-items-start justify-content-between">
-                                               <h6 class="mb-0">{{ arch }}</h6>
-
-                                               {% if arch in release.experimental_arches %}
-                                                       <span class="badge badge-success">{{ _("Experimental") }}</span>
-                                               {% elif arch in release.secondary_arches %}
-                                                       <span class="badge badge-warning">{{ _("Legacy") }}</span>
-                                               {% end %}
-                                       </div>
-
-                                       {% for file in release.get_files_by_arch(arch) %}
-                                               <a class="list-group-item list-group-item-action download-splash" href="{{ file.url }}">
-                                                       <h6>
-                                                               {{ _(file.desc) }} <i class="fas fa-download text-primary"></i>
+                       <div class="card-deck">
+                               {% for arch in release.arches %}
+                                       <div class="card">
+                                               <div class="card-body">
+                                                       <h6 class="card-title mb-0">
+                                                               {{ arch }}
+
+                                                               {% if arch in release.experimental_arches %}
+                                                                       <span class="badge badge-success">{{ _("Experimental") }}</span>
+                                                               {% elif arch in release.secondary_arches %}
+                                                                       <span class="badge badge-warning">{{ _("Legacy") }}</span>
+                                                               {% end %}
                                                        </h6>
-
-                                                       <ul class="list-inline text-muted small mb-0">
-                                                               <li class="list-inline-item">
-                                                                       {{ format_size(file.size) }}
-                                                               </li>
-
-                                                               <li class="list-inline-item">
-                                                                       {{ "%s: %s" % ("SHA256" if file.sha256 else "SHA1", file.sha256 or file.sha1) }}
-                                                               </li>
-                                                       </ul>
-                                               </a>
-                                       {% end %}
+                                               </div>
+
+                                               <div class="list-group list-group-flush">
+                                                       {% for file in release.get_files_by_arch(arch) %}
+                                                               <a class="list-group-item list-group-item-action
+                                                                               d-flex justify-content-between align-items-center download-splash" href="{{ file.url }}">
+                                                                       <span>
+                                                                               <i class="fas fa-download text-primary"></i> {{ _(file.desc) }}
+                                                                       </span>
+
+                                                                       <span class="text-muted small">
+                                                                               {{ format_size(file.size) }}
+                                                                       </span>
+                                                               </a>
+                                                       {% end %}
+                                               </div>
+                                       </div>
                                {% end %}
                        </div>
                </section>