From 3c64c00b749a7edc909361a008dca8d2c35c9d5a Mon Sep 17 00:00:00 2001
From: Joe Knapper <jaknapper@hotmail.com>
Date: Thu, 18 Jun 2026 12:59:05 +0100
Subject: [PATCH 1/7] Help message appears if no logs at current level,
 conditional pagination

---
 .../tabContentComponents/loggingContent.vue           | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/webapp/src/components/tabContentComponents/loggingContent.vue b/webapp/src/components/tabContentComponents/loggingContent.vue
index 56cb3ee3..91d85132 100644
--- a/webapp/src/components/tabContentComponents/loggingContent.vue
+++ b/webapp/src/components/tabContentComponents/loggingContent.vue
@@ -35,6 +35,16 @@
       </div>
     </nav>
 
+    <div class="uk-width-xlarge uk-align-center">
+      <div v-if="filteredItems.length == 0" class="uk-alert-primary" uk-alert>
+        <p>
+          No log entries found at the current filter level (<strong>{{ filterLevel }}</strong> or
+          higher).
+        </p>
+        <p>You can include lower levels using the dropdown in the top left.</p>
+      </div>
+    </div>
+
     <!-- Logging items -->
     <div class="uk-width-xlarge uk-align-center">
       <div
@@ -81,6 +91,7 @@
         <!-- eslint-enable -->
       </div>
       <PaginateLinks
+        v-if="filteredItems.length > 0"
         :total-pages="totalPages"
         :current-page="currentPage"
         @change-page="changePage"

From 816dad79fa5feaafb0b6b3575d7cfe067b0fbcca Mon Sep 17 00:00:00 2001
From: Joe Knapper <jaknapper@hotmail.com>
Date: Thu, 18 Jun 2026 12:59:41 +0100
Subject: [PATCH 2/7] Add task status messages to collapsed log, give summary
 more space

---
 .../labThingsComponents/actionLogDisplay.vue  | 19 ++++++++++++-------
 1 file changed, 12 insertions(+), 7 deletions(-)

diff --git a/webapp/src/components/labThingsComponents/actionLogDisplay.vue b/webapp/src/components/labThingsComponents/actionLogDisplay.vue
index 364a8bfb..1cd0ebd2 100644
--- a/webapp/src/components/labThingsComponents/actionLogDisplay.vue
+++ b/webapp/src/components/labThingsComponents/actionLogDisplay.vue
@@ -2,7 +2,6 @@
   <div class="action-log-display">
     <!-- Toggle button -->
     <button
-      v-if="log.length"
       class="log-toggle"
       :title="isCollapsed ? 'Show full log' : 'Hide full log'"
       :aria-label="isCollapsed ? 'Show full log' : 'Hide full log'"
@@ -15,9 +14,15 @@
 
     <!-- Header always shows latest message-->
     <div class="log-summary">
-      <span v-if="latestMessage">
+      <div v-if="latestMessage">
         {{ latestMessage }}
-      </span>
+      </div>
+      <div v-else-if="taskStatus === 'error'">
+        <p>The task failed due to an error:</p>
+        <p>{{ errorMessage }}</p>
+      </div>
+      <div v-else-if="taskStatus == 'cancelled'">The task was cancelled.</div>
+      <div v-else-if="taskStatus == 'completed'">The task completed successfully.</div>
     </div>
 
     <!-- Expanded view shows log -->
@@ -175,8 +180,8 @@ export default {
 }
 
 .log-summary {
-  padding: 0.6em;
-  padding-right: 2.5em; /* reserve room for the toggle button, prevents overlap */
+  padding: 2px;
+  padding-right: 30px; /* reserve room for the toggle button, prevents overlap */
   display: flex;
   align-items: center;
   justify-content: center;
@@ -215,8 +220,8 @@ export default {
 /* Toggle button */
 .log-toggle {
   position: absolute;
-  top: 6px;
-  right: 6px;
+  top: 0;
+  right: 2px;
   background: transparent;
   border: none;
   padding: 4px;

From 4c835d7be543ea5bc3760062146e33fc5f78dfbc Mon Sep 17 00:00:00 2001
From: Joe Knapper <jaknapper@hotmail.com>
Date: Thu, 18 Jun 2026 14:30:18 +0100
Subject: [PATCH 3/7] Clamp log summary to two lines with elipsis

---
 .../labThingsComponents/actionLogDisplay.vue  | 27 ++++++++++++++-----
 1 file changed, 20 insertions(+), 7 deletions(-)

diff --git a/webapp/src/components/labThingsComponents/actionLogDisplay.vue b/webapp/src/components/labThingsComponents/actionLogDisplay.vue
index 1cd0ebd2..c3d06897 100644
--- a/webapp/src/components/labThingsComponents/actionLogDisplay.vue
+++ b/webapp/src/components/labThingsComponents/actionLogDisplay.vue
@@ -14,15 +14,20 @@
 
     <!-- Header always shows latest message-->
     <div class="log-summary">
-      <div v-if="latestMessage">
+      <div v-if="latestMessage" class="log-summary-text">
         {{ latestMessage }}
       </div>
-      <div v-else-if="taskStatus === 'error'">
+      <div v-else-if="taskStatus === 'error'" class="log-summary-text">
         <p>The task failed due to an error:</p>
         <p>{{ errorMessage }}</p>
+        <p>{{ errorMessage }}</p>
+      </div>
+      <div v-else-if="taskStatus == 'cancelled'" class="log-summary-text">
+        The task was cancelled.
+      </div>
+      <div v-else-if="taskStatus == 'completed'" class="log-summary-text">
+        The task completed successfully.
       </div>
-      <div v-else-if="taskStatus == 'cancelled'">The task was cancelled.</div>
-      <div v-else-if="taskStatus == 'completed'">The task completed successfully.</div>
     </div>
 
     <!-- Expanded view shows log -->
@@ -182,12 +187,20 @@ export default {
 .log-summary {
   padding: 2px;
   padding-right: 30px; /* reserve room for the toggle button, prevents overlap */
-  display: flex;
+  display: block;
   align-items: center;
-  justify-content: center;
+}
+
+.log-summary-text {
   text-align: center;
   font-size: large;
-  box-sizing: border-box;
+  min-height: calc(2 * 1.4em); /* ALWAYS reserve 2 lines */
+  line-height: 1.4em;
+  overflow: hidden;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  line-clamp: 2; /* Future version of webkit-line-clamp, not fully supported yet */
 }
 
 .log-container {

From 9796695b5426c4d05fd186a4b044b210d144dfff Mon Sep 17 00:00:00 2001
From: Joe Knapper <jaknapper@hotmail.com>
Date: Thu, 18 Jun 2026 14:54:54 +0100
Subject: [PATCH 4/7] Padding around status

---
 webapp/src/components/labThingsComponents/actionLogDisplay.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/webapp/src/components/labThingsComponents/actionLogDisplay.vue b/webapp/src/components/labThingsComponents/actionLogDisplay.vue
index c3d06897..21397c5d 100644
--- a/webapp/src/components/labThingsComponents/actionLogDisplay.vue
+++ b/webapp/src/components/labThingsComponents/actionLogDisplay.vue
@@ -196,6 +196,7 @@ export default {
   font-size: large;
   min-height: calc(2 * 1.4em); /* ALWAYS reserve 2 lines */
   line-height: 1.4em;
+  padding: 0px 5px; /* Give some padding so there's room for ... to not expand too far */
   overflow: hidden;
   display: -webkit-box;
   -webkit-box-orient: vertical;

From b14b30f9c790e4ffa2039d63966cb88999b2c303 Mon Sep 17 00:00:00 2001
From: Joe Knapper <jaknapper@hotmail.com>
Date: Thu, 18 Jun 2026 17:11:05 +0100
Subject: [PATCH 5/7] Remove competing css from actionStatusModal including
 max-height

---
 .../labThingsComponents/actionStatusModal.vue | 22 -------------------
 1 file changed, 22 deletions(-)

diff --git a/webapp/src/components/labThingsComponents/actionStatusModal.vue b/webapp/src/components/labThingsComponents/actionStatusModal.vue
index 899a793b..c890303b 100644
--- a/webapp/src/components/labThingsComponents/actionStatusModal.vue
+++ b/webapp/src/components/labThingsComponents/actionStatusModal.vue
@@ -125,29 +125,7 @@ export default {
   margin-right: 5px;
 }
 
-#status-modal {
-  max-height: 90vh; // never exceed 90% of viewport height
-  display: flex;
-  flex-direction: column;
-}
-
 #status-modal h2 {
   flex: 0 0 auto; // title never shrinks
 }
-
-#status-modal .action-log-display {
-  flex: 1 1 auto;
-  min-height: 0;
-}
-
-#status-modal .log-wrapper {
-  flex: 1 1 200px; // prefer 200px, shrink only under pressure
-  min-height: 2.6em; // floor: one line
-}
-
-#status-modal .log-container {
-  height: auto;
-  flex: 1 1 auto;
-  min-height: 2.6em;
-}
 </style>

From bbe6e997367b0a8db99e8a985a078b1652313cde Mon Sep 17 00:00:00 2001
From: Joe Knapper <jaknapper@hotmail.com>
Date: Fri, 19 Jun 2026 10:30:30 +0100
Subject: [PATCH 6/7] Always show results message

---
 .../labThingsComponents/actionLogDisplay.vue  | 43 ++++++++++++-------
 1 file changed, 27 insertions(+), 16 deletions(-)

diff --git a/webapp/src/components/labThingsComponents/actionLogDisplay.vue b/webapp/src/components/labThingsComponents/actionLogDisplay.vue
index 21397c5d..11236c76 100644
--- a/webapp/src/components/labThingsComponents/actionLogDisplay.vue
+++ b/webapp/src/components/labThingsComponents/actionLogDisplay.vue
@@ -12,21 +12,32 @@
       </span>
     </button>
 
-    <!-- Header always shows latest message-->
+    <!-- Header always shows latest message -->
     <div class="log-summary">
-      <div v-if="latestMessage" class="log-summary-text">
-        {{ latestMessage }}
-      </div>
-      <div v-else-if="taskStatus === 'error'" class="log-summary-text">
-        <p>The task failed due to an error:</p>
-        <p>{{ errorMessage }}</p>
-        <p>{{ errorMessage }}</p>
-      </div>
-      <div v-else-if="taskStatus == 'cancelled'" class="log-summary-text">
-        The task was cancelled.
-      </div>
-      <div v-else-if="taskStatus == 'completed'" class="log-summary-text">
-        The task completed successfully.
+      <div class="log-summary-text">
+        <template v-if="taskStatus === 'error'">
+          <p>The task failed due to an error:</p>
+          <p>{{ errorMessage }}</p>
+        </template>
+
+        <template v-else-if="taskStatus == 'cancelled'"> The task was cancelled. </template>
+
+        <template v-else-if="taskStatus == 'completed'">
+          The task completed successfully.
+        </template>
+
+        <template
+          v-if="
+            latestMessage &&
+            (taskStatus === 'error' || taskStatus === 'cancelled' || taskStatus === 'completed')
+          "
+        >
+          <br />
+        </template>
+
+        <template v-if="latestMessage">
+          {{ latestMessage }}
+        </template>
       </div>
     </div>
 
@@ -194,9 +205,9 @@ export default {
 .log-summary-text {
   text-align: center;
   font-size: large;
-  min-height: calc(2 * 1.4em); /* ALWAYS reserve 2 lines */
+  height: calc(2 * 1.4em); /* height of element is 2 lines */
   line-height: 1.4em;
-  padding: 0px 5px; /* Give some padding so there's room for ... to not expand too far */
+  padding: 0 5px; /* Give some padding so there's room for ... to not expand too far */
   overflow: hidden;
   display: -webkit-box;
   -webkit-box-orient: vertical;

From 559d211df8c839adf02d37f032ba7cec23de243b Mon Sep 17 00:00:00 2001
From: Julian Stirling <julian@julianstirling.co.uk>
Date: Sun, 21 Jun 2026 15:04:40 +0000
Subject: [PATCH 7/7] Use same colours for empty log message as for info logs

---
 .../tabContentComponents/loggingContent.vue   | 20 +++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/webapp/src/components/tabContentComponents/loggingContent.vue b/webapp/src/components/tabContentComponents/loggingContent.vue
index 91d85132..deaffe4d 100644
--- a/webapp/src/components/tabContentComponents/loggingContent.vue
+++ b/webapp/src/components/tabContentComponents/loggingContent.vue
@@ -35,18 +35,18 @@
       </div>
     </nav>
 
-    <div class="uk-width-xlarge uk-align-center">
-      <div v-if="filteredItems.length == 0" class="uk-alert-primary" uk-alert>
-        <p>
-          No log entries found at the current filter level (<strong>{{ filterLevel }}</strong> or
-          higher).
-        </p>
-        <p>You can include lower levels using the dropdown in the top left.</p>
-      </div>
-    </div>
-
     <!-- Logging items -->
     <div class="uk-width-xlarge uk-align-center">
+      <div v-if="filteredItems.length == 0" class="logging-entry" uk-alert>
+        <div class="logging-entry-body">
+          <p>
+            No log entries found at the current filter level (<strong>{{ filterLevel }}</strong> or
+            higher).
+          </p>
+          <p>You can include lower levels using the dropdown in the top left.</p>
+        </div>
+      </div>
+
       <div
         v-for="item in pagedItems"
         :key="item.sequence"