260710_1

ui_template/ui_template_workflow_layout.css

@@ -100,6 +100,20 @@
   background: var(--color-paper);
   color: var(--color-text-secondary);
   font-size: var(--text-caption);
+  border: 1px solid transparent;
+  cursor: default;
+  transition:
+    background-color var(--transition-base),
+    color var(--transition-base),
+    cursor var(--transition-base);
+}
+
+.ui-workflow-layout__step.is-enabled {
+  cursor: pointer;
+}
+
+.ui-workflow-layout__step.is-enabled:hover {
+  background: var(--color-paper-hover, var(--color-paper));
 }
 
 .ui-workflow-layout__step.is-active {
@@ -107,6 +121,28 @@
   color: var(--color-accent);
 }
 
+.ui-workflow-layout__step:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.ui-workflow-layout__step.state-complete {
+  border-color: var(--color-success);
+}
+
+.ui-workflow-layout__step.state-in_progress {
+  border-color: var(--color-warning);
+}
+
+.ui-workflow-layout__step.state-stale {
+  border-color: var(--color-muted);
+  opacity: 0.7;
+}
+
+.ui-workflow-layout__step.state-failed {
+  border-color: var(--color-danger);
+}
+
 .ui-workflow-layout__body {
   position: relative;
   display: block;