From 4e9c4bfb04feb62e174da7c0611829c5d41f0c32 Mon Sep 17 00:00:00 2001
From: Oliver Giles <ohw.giles@gmail.com>
Date: Fri, 4 Sep 2020 13:10:09 +1200
Subject: [PATCH] run page: switch progress bar and nav buttons

the navigation buttons are more usable next to other
navigation elements. This is especially noticeable on
large monitors.
---
 src/resources/index.html | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/src/resources/index.html b/src/resources/index.html
index 0072205..c5f13ee 100644
--- a/src/resources/index.html
+++ b/src/resources/index.html
@@ -138,16 +138,15 @@
  
  <template id="run"><div style="display: grid; grid-template-rows: auto 1fr">
   <div style="padding: 15px">
-   <div style="display: grid; grid-template-columns: auto 1fr 400px auto auto; gap: 5px; align-items: center">
+   <div style="display: grid; grid-template-columns: auto 25px auto auto 1fr 400px; gap: 5px; align-items: center">
     <h2 style="white-space: nowrap"><span v-html="runIcon(job.result)"></span> {{$route.params.name}} #{{$route.params.number}}</h2>
     <span></span>
-    <div><!-- extra div to preserve grid columns when v-show hides the progress bar -->
-     <div class="progress" v-show="job.result == 'running'">
-      <div class="progress-bar" :class="{overtime:job.overtime,indeterminate:!job.etc}" :style="job.etc && {width:job.progress+'%'}"></div>
-     </div>
-    </div>
     <router-link :disabled="$route.params.number == 1" :to="'/jobs/'+$route.params.name+'/'+($route.params.number-1)" tag="button">&laquo;</router-link>
     <router-link :disabled="$route.params.number == latestNum" :to="'/jobs/'+$route.params.name+'/'+(parseInt($route.params.number)+1)" tag="button">&raquo;</router-link>
+    <span></span>
+    <div class="progress" v-show="job.result == 'running'">
+     <div class="progress-bar" :class="{overtime:job.overtime,indeterminate:!job.etc}" :style="job.etc && {width:job.progress+'%'}"></div>
+    </div>
    </div>
    <div id="page-run-detail">
     <dl>