web: Refactor jobs list

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

diff --git a/src/templates/index.html b/src/templates/index.html
index 0847998720170433cd9ffd705343af77799222c9..94f080c8bf0a16481b15c7bd42829a1575994d14 100644 (file)
--- a/src/templates/index.html
+++ b/src/templates/index.html
@@ -16,7 +16,7 @@
 
        {% if jobs %}
                <section class="section">
-                       <h5>{{ _("Current Jobs") }}</h5>
+                       <h1 class="title">{{ _("Running Jobs") }}</h1>
 
                        {% module JobsList(jobs) %}
                </section>

diff --git a/src/templates/modules/jobs/list.html b/src/templates/modules/jobs/list.html
index 457ea9a0fd728db392f362349adbd7de0f327f8f..b5db2094b0211b284d02b87b673ab218eeaa14d3 100644 (file)
--- a/src/templates/modules/jobs/list.html
+++ b/src/templates/modules/jobs/list.html
@@ -1,61 +1,61 @@
 {% for job in jobs %}
-       <div class="callout small ">
-               <div class="grid-x grid-padding-x align-middle">
-                       <div class="cell medium-5">
-                               <h6>
-                                       {% if show_arch_only %}
-                                               {{ job.arch }}
-                                       {% else %}
-                                               <a href="/builds/{{ job.build.uuid }}">{{ job }}</a>
-                                       {% end %}
-                               </h6>
-
-                               {% if job.has_failed() %}
-                                       <span class="alert label">{{ _("Failed") }}</span>
-                               {% end %}
+       {% set build = job.build %}
 
-                               {# Show all packages that have been built #}
-                               {% if show_packages and job.packages %}
-                                       <ul>
-                                               {% for package in job.packages %}
-                                                       <li>
-                                                               <a href="/packages/{{ package.uuid }}">
-                                                                       {{ package }}
+       <div class="block">
+               <div class="card">
+                       <div class="card-content">
+                               <div class="columns">
+                                       <div class="column">
+                                               <h5 class="title is-5">
+                                                       {% if show_arch_only %}
+                                                               {{ job.arch }}
+                                                       {% else %}
+                                                               <a href="/builds/{{ build.uuid }}">
+                                                                       {{ job }}
                                                                </a>
-                                                       </li>
+                                                       {% end %}
+
+                                                       {% if job.has_failed() %}
+                                                               <span class="tag is-danger">
+                                                                       {{ _("Failed") }}
+                                                               </span>
+                                                       {% end %}
+                                               </h5>
+
+                                               {% if build.owner %}
+                                                       <h6 class="subtitle is-6">
+                                                               {{ build.owner }}
+                                                       </h6>
                                                {% end %}
-                                       </ul>
-                               {% end %}
-                       </div>
+                                       </div>
 
-                       <div class="cell medium-7">
-                               <div class="menu vertical align-right">
                                        {% if job.is_running() %}
-                                               <li class="menu-text">
+                                               <div class="column is-2">
                                                        {{ format_time(job.duration, shorter=True) }}
-                                               </li>
+                                               </div>
                                        {% elif job.has_finished() %}
-                                               <li class="menu-text">
+                                               <div class="column is-3">
                                                        {{ _("Finished %s") % \
                                                                locale.format_date(job.finished_at, shorter=True) }}
-                                               </li>
-                                       {% end %}
-
-                                       {% if job.build.owner %}
-                                               <li>
-                                                       {{ _("by %s") % job.build.owner }}
-                                               </li>
-                                       {% end %}
-
-                                       {% if job.builder %}
-                                               <li>
-                                                       <a href="/builders/{{ job.builder.hostname }}">
-                                                               {{ _("on %s") % job.builder }}
-                                                       </a>
-                                               </li>
+                                               </div>
                                        {% end %}
                                </div>
                        </div>
+
+                       {# Show all packages that have been built #}
+                       {% if show_packages and job.packages %}
+                               <div class="card-content">
+                                       <ul>
+                                               {% for package in job.packages %}
+                                                       <li>
+                                                               <a href="/packages/{{ package.uuid }}">
+                                                                       {{ package }}
+                                                               </a>
+                                                       </li>
+                                               {% end %}
+                                       </ul>
+                               </div>
+                       {% end %}
                </div>
        </div>
 {% end %}