display idle/failed pods with dashed border

This commit is contained in:
2025-08-18 18:14:06 +02:00
parent e717f85c52
commit 0fbade138d

View File

@@ -34,12 +34,17 @@
// set uptime // set uptime
let uptime = writable(new Date().getTime() - new Date(status?.startTime || 0).getTime()); let uptime = writable(new Date().getTime() - new Date(status?.startTime || 0).getTime());
function idlePhase(phase: string | undefined) {
const phases = ['Failed', 'Succeeded'];
return phases.includes(phase || '');
}
onMount(() => { onMount(() => {
setInterval(() => uptime.update((n) => n + 1000), 1000); setInterval(() => uptime.update((n) => n + 1000), 1000);
}); });
</script> </script>
<div class="card"> <div class={`card ${idlePhase(status?.phase) && 'not-running'}`}>
<div class="header"> <div class="header">
<div class="icon"><Layers /></div> <div class="icon"><Layers /></div>
<span class="name">{name}</span> <span class="name">{name}</span>
@@ -131,6 +136,11 @@
); );
pointer-events: all; pointer-events: all;
cursor: auto; cursor: auto;
&.not-running {
border: 2px dashed var(--theme);
opacity: 0.6;
}
} }
.header { .header {