shad/canvas-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(explainer): FlowMaster Explainer scene from Hindsight + EA2 doctrine

Browse Source 
Eight-card explainer covering Business-as-Code philosophy, the five
element types (Flow/Data/View/Rule/Version), the DEFINE/VERSION/DEPLOY/
EXECUTE lifecycle, hubs, work items, EA2 graph storage, and the Pi
agent. Sourced from FlowMaster Element Architecture v2.1 + the EA2
collection/edge contracts recalled from Hindsight today.

New 'What is FlowMaster?' chip on Landing routes here.
This commit is contained in:
shad
2026-06-14 12:54:23 +04:00
parent 97f14dd6f7
commit 0fb5351a3a
5 changed files with 122 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/index.css
+14
View File
@@ -1980,3 +1980,17 @@ select.studio-input { background: var(--bp-paper); }
@media (max-width: 700px) {
.geo-map-wrap { height: 380px; }
}
.explainer-scene { padding: 32px 24px; max-width: 1200px; margin: 0 auto; background: var(--bp-paper); min-height: calc(100vh - 60px); }
.explainer-head { margin-bottom: 32px; max-width: 800px; }
.explainer-intro { font-size: 14px; color: var(--bp-muted); line-height: 1.6; margin-top: 8px; }
.explainer-jump-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.explainer-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 16px; }
.explainer-card { padding: 18px; background: var(--bp-paper); border: 1px solid var(--bp-navy); display: flex; flex-direction: column; gap: 8px; }
.explainer-card-num { font-family: var(--bp-mono); font-size: 11px; color: var(--bp-muted); }
.explainer-card-eyebrow { font-family: var(--bp-mono); font-size: 10px; letter-spacing: 0.08em; color: var(--bp-amber); text-transform: uppercase; }
.explainer-card-title { font-size: 16px; font-weight: 700; color: var(--bp-navy); margin: 0; }
.explainer-card-body { font-size: 12px; line-height: 1.55; color: var(--bp-navy); white-space: pre-wrap; margin: 0; }
.explainer-foot { margin-top: 32px; padding-top: 16px; border-top: 1px solid color-mix(in srgb, var(--bp-navy) 25%, transparent); }
.explainer-foot-label { font-family: var(--bp-mono); font-size: 10px; letter-spacing: 0.08em; color: var(--bp-muted); }
.explainer-foot p { font-size: 11px; color: var(--bp-muted); margin-top: 4px; }