lda.chat/lda-wf
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: clarify presentation demo proof surfaces

Browse Source
This commit is contained in:
lda
2026-07-09 21:15:15 +07:00 Verified
parent fe8e4cee40
commit 7ce81c8f23
11 changed files with 349 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/apps/console/src/presentation/styles/demo-workflow.css
+103 -11
View File
@@ -552,7 +552,7 @@
}
.demo-workflow-stage[data-demo-layout="interrupt"] .demo-workflow-stage__graph {
grid-template-columns: minmax(20rem, 0.95fr) minmax(24rem, 1.05fr);
grid-template-columns: minmax(28rem, 1.25fr) minmax(20rem, 0.75fr);
align-items: stretch;
gap: 1rem;
}
@@ -599,7 +599,7 @@
@media (max-width: 1050px) {
.demo-workflow-stage[data-demo-layout="interrupt"] .demo-workflow-stage__graph {
grid-template-columns: minmax(17rem, 40%) minmax(0, 1fr);
grid-template-columns: minmax(24rem, 1.15fr) minmax(0, 0.85fr);
}
}
@@ -666,7 +666,34 @@
white-space: nowrap;
}
.interrupt-contract-preview__schema > span {
.interrupt-contract-preview__details {
display: grid;
grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
gap: 0.8rem;
min-height: 0;
border-top: 1px solid var(--stage-line);
padding-top: 0.7rem;
overflow: hidden;
}
.interrupt-contract-preview__schema,
.interrupt-contract-preview__payload,
.interrupt-contract-preview__issues {
min-height: 0;
border: 1px solid color-mix(in oklch, var(--stage-line) 72%, transparent);
border-radius: 0.6rem;
padding: 0.75rem 0.85rem;
overflow: hidden;
background: oklch(0.09 0.022 250 / 0.92);
}
.interrupt-contract-preview__payload {
grid-row: span 2;
}
.interrupt-contract-preview__schema > span,
.interrupt-contract-preview__payload > span,
.interrupt-contract-preview__issues > span {
color: var(--text-muted);
font: 650 0.6rem/1 var(--font-mono, monospace);
letter-spacing: 0.1em;
@@ -674,9 +701,7 @@
}
.interrupt-contract-preview__schema {
min-height: 0;
border-top: 1px solid var(--stage-line);
padding-top: 0.7rem;
border-top: 0;
}
.interrupt-contract-preview__schema strong {
@@ -686,18 +711,66 @@
text-transform: uppercase;
}
.interrupt-contract-preview__schema pre {
max-height: 7.5rem;
.interrupt-contract-preview__schema pre,
.interrupt-contract-preview__payload pre {
max-height: 16rem;
margin: 0.45rem 0 0;
overflow: auto;
color: color-mix(in oklch, var(--text-primary) 82%, var(--text-muted));
font: 0.63rem/1.45 var(--font-mono, monospace);
font: 0.74rem/1.5 var(--font-mono, monospace);
white-space: pre-wrap;
scrollbar-width: none;
}
.interrupt-contract-preview__schema code,
.interrupt-contract-preview__payload code {
color: color-mix(in oklch, var(--text-primary) 92%, white);
}
.interrupt-contract-preview__schema pre::-webkit-scrollbar,
.interrupt-contract-preview__payload pre::-webkit-scrollbar {
display: none;
}
.interrupt-contract-preview__issues ul {
display: grid;
gap: 0.45rem;
margin: 0.45rem 0 0;
padding: 0;
list-style: none;
}
.interrupt-contract-preview__issues li {
display: flex;
gap: 0.5rem;
align-items: center;
justify-content: space-between;
border: 1px solid color-mix(in oklch, var(--stage-line) 72%, transparent);
border-radius: 0.55rem;
padding: 0.45rem 0.55rem;
background: oklch(0.12 0.026 250 / 0.9);
}
.interrupt-contract-preview__issues strong {
min-width: 0;
overflow: hidden;
color: var(--text-primary);
font-size: 0.78rem;
text-overflow: ellipsis;
white-space: nowrap;
}
.interrupt-contract-preview__issues small {
border-radius: 0.35rem;
padding: 0.1rem 0.35rem;
background: color-mix(in oklch, var(--accent-amber) 24%, transparent);
color: var(--accent-amber);
font: 650 0.62rem/1.3 var(--font-mono, monospace);
}
@media (max-width: 1050px) {
.demo-workflow-stage__graph:has(.interrupt-contract-preview) {
grid-template-columns: minmax(0, 1fr) 15rem;
grid-template-columns: minmax(0, 1fr) minmax(14rem, 0.7fr);
}
.presentation-route .workflow-graph-stage__node {
@@ -767,7 +840,7 @@
}
.interrupt-contract-preview__schema pre {
max-height: 8rem;
max-height: 12rem;
}
}
@@ -1062,6 +1135,25 @@
min-height: 0;
display: grid;
align-items: stretch;
overflow: hidden;
}
.guided-product-moment[data-moment="approval"] {
gap: 0.55rem;
}
.guided-product-moment[data-moment="approval"] .guided-product-moment__header {
grid-template-columns: minmax(0, 0.42fr) minmax(0, 1fr);
padding: 0.55rem 0.75rem;
}
.guided-product-moment[data-moment="approval"] .guided-product-moment__header strong {
font-size: 1rem;
}
.guided-product-moment[data-moment="approval"] .guided-product-moment__header p {
font-size: 0.82rem;
line-height: 1.35;
}
.guided-product-moment[data-moment="approval"] .interrupt-contract-preview {