From 3b02f56d2b8cd5eca8e8d7cfe86e70b56fcdfbd6 Mon Sep 17 00:00:00 2001
From: oppiliappan <me@oppi.li>
Date: Tue, 18 Aug 2026 13:14:31 +0100
Subject: [PATCH] web: style improvements to WorkflowLogs

Signed-off-by: oppiliappan <me@oppi.li>
---
 .../components/repo/pipelines/WorkflowLogs.svelte | 15 ++++++---------
 1 file changed, 6 insertions(+), 9 deletions(-)

diff --git a/web/src/lib/components/repo/pipelines/WorkflowLogs.svelte b/web/src/lib/components/repo/pipelines/WorkflowLogs.svelte
index 95d75e17..de29117e 100644
--- a/web/src/lib/components/repo/pipelines/WorkflowLogs.svelte
+++ b/web/src/lib/components/repo/pipelines/WorkflowLogs.svelte
@@ -8,11 +8,11 @@
 			sizer: "relative w-full",
 			row: "absolute top-0 left-0 flex w-full",
 			header:
-				"sticky top-0 z-10 flex w-full items-center gap-2 rounded-t border-x border-t border-border-default bg-background-default px-3 text-left transition-colors hover:bg-background-subtle shadow-xs",
+				"sticky top-0 z-10 flex w-full items-center gap-2 rounded-t border-x border-t border-border-default bg-background-default cursor-pointer px-3 text-left font-sans typography-paragraph-regular shadow-xs",
 			chevron: "size-4 shrink-0 text-foreground-muted",
 			name: "truncate font-semibold text-foreground-default",
 			elapsed: "ml-auto shrink-0 tabular-nums text-foreground-muted",
-			body: "w-full min-w-0 border-x border-border-default bg-background-subtle px-3",
+			body: "w-full min-w-0 border-x border-border-default bg-background-default px-3",
 			command: "break-all whitespace-pre-wrap text-foreground-info",
 			line: "break-all whitespace-pre-wrap text-foreground-default",
 			empty:
@@ -21,9 +21,8 @@
 		},
 		variants: {
 			// closed step rounds both ends
-			collapsed: { true: { header: "rounded-b border-b" }, false: {} },
-			// first row carries rule under header
-			first: { true: { body: "border-t pt-1.5" }, false: {} },
+			collapsed: { true: { header: "rounded-b border-b" }, false: { header: "border-b" } },
+			first: { true: { body: "pt-1.5" }, false: {} },
 			// last row rounds bottom corners
 			last: { true: { body: "rounded-b border-b pb-1.5" }, false: {} }
 		}
@@ -45,6 +44,7 @@
 	import ChevronDown from "$icon/chevron-down";
 	import ChevronRight from "$icon/chevron-right";
 	import TriangleAlert from "$icon/triangle-alert";
+	import Error from "$lib/components/ui/Error.svelte";
 	import Spinner from "$lib/components/ui/Spinner.svelte";
 	import Elapsed from "./Elapsed.svelte";
 	import { isLastRow, rowKey, toRows, type LogStep } from "./logs";
@@ -250,10 +250,7 @@
 {/if}
 
 {#if error}
-	<div class={classes().status()}>
-		<TriangleAlert class="size-4 text-foreground-danger" aria-hidden="true" />
-		{error}
-	</div>
+	<Error label={error} class="mt-2" />
 {:else if status === "connecting" && steps.length > 0}
 	<div class={classes().status()}><Spinner class="size-4" /> Reconnecting to the spindle</div>
 {/if}
-- 
2.51.2