fix: finish evaluation closing visuals
This commit is contained in:
@@ -42,6 +42,7 @@ Design contracts:
|
|||||||
- [`presentation live/replay truth`](superpowers/specs/2026-07-09-presentation-live-replay-truth-design.md)
|
- [`presentation live/replay truth`](superpowers/specs/2026-07-09-presentation-live-replay-truth-design.md)
|
||||||
- [`presentation lifecycle story expansion`](superpowers/specs/2026-07-09-presentation-lifecycle-story-expansion-design.md)
|
- [`presentation lifecycle story expansion`](superpowers/specs/2026-07-09-presentation-lifecycle-story-expansion-design.md)
|
||||||
- [`presentation opening visuals`](superpowers/specs/2026-07-10-presentation-opening-visuals-design.md)
|
- [`presentation opening visuals`](superpowers/specs/2026-07-10-presentation-opening-visuals-design.md)
|
||||||
|
- [`presentation evaluation and closing`](superpowers/specs/2026-07-10-presentation-evaluation-closing-design.md)
|
||||||
|
|
||||||
Implementation order:
|
Implementation order:
|
||||||
|
|
||||||
@@ -186,10 +187,8 @@ Presentation visual audit, July 10:
|
|||||||
- Needs product-flow cohesion: Scenes 8-12 now have the right factual spine,
|
- Needs product-flow cohesion: Scenes 8-12 now have the right factual spine,
|
||||||
but the demo surfaces still need stronger hierarchy between chat, operation,
|
but the demo surfaces still need stronger hierarchy between chat, operation,
|
||||||
lifecycle, graph, interrupt, output, and evidence.
|
lifecycle, graph, interrupt, output, and evidence.
|
||||||
- Needs non-text evaluation visuals: Scene 13 should become a compact evidence
|
- Completed: Scenes 13 and 14 now close with a bounded evaluation board,
|
||||||
board or chart-like summary instead of prose-heavy results.
|
contribution boundary/future-work map, and canonical defense-question index.
|
||||||
- Needs closing visual: Scene 14 should land the boundary/future-work message
|
|
||||||
with one memorable diagram, not just limits text.
|
|
||||||
|
|
||||||
Recommended next visual slices:
|
Recommended next visual slices:
|
||||||
|
|
||||||
@@ -213,8 +212,12 @@ Recommended next visual slices:
|
|||||||
output, and trace beats read as product evidence without chat competing for
|
output, and trace beats read as product evidence without chat competing for
|
||||||
space. Implementation:
|
space. Implementation:
|
||||||
[`guided proof scene composition cleanup`](historical/superpowers/plans/2026-07-10-guided-proof-scene-composition-cleanup.md).
|
[`guided proof scene composition cleanup`](historical/superpowers/plans/2026-07-10-guided-proof-scene-composition-cleanup.md).
|
||||||
5. Evidence and closing visuals: make Scenes 13 and 14 readable as a defense
|
5. Completed: Evidence and closing visuals make Scenes 13 and 14 readable as a
|
||||||
artifact: evaluation board, claim boundaries, and future-work map.
|
defense artifact: bounded evaluation board, claim boundaries, future-work
|
||||||
|
map, and canonical examiner-question index. Design:
|
||||||
|
[`presentation evaluation and closing`](superpowers/specs/2026-07-10-presentation-evaluation-closing-design.md).
|
||||||
|
Implementation:
|
||||||
|
[`presentation evaluation and closing plan`](historical/superpowers/plans/2026-07-10-presentation-evaluation-closing.md).
|
||||||
|
|
||||||
Presentation wishlist / defense readiness:
|
Presentation wishlist / defense readiness:
|
||||||
|
|
||||||
|
|||||||
@@ -173,6 +173,10 @@ prepared `lda_report_workflow` story. It renders a 12-scene, multi-beat
|
|||||||
storyboard with an adaptive aspect-ratio canvas, stable stage regions, discussion
|
storyboard with an adaptive aspect-ratio canvas, stable stage regions, discussion
|
||||||
branches, act themes, a chat dock, and keyboard navigation.
|
branches, act themes, a chat dock, and keyboard navigation.
|
||||||
|
|
||||||
|
The final presentation beats frame the evaluation as bounded evidence, make
|
||||||
|
claim boundaries and future work explicit, and end on the canonical defense
|
||||||
|
discussion index rather than a benchmark or generic conclusion.
|
||||||
|
|
||||||
Scenes 8 through 10 use the canonical replay as their only execution evidence.
|
Scenes 8 through 10 use the canonical replay as their only execution evidence.
|
||||||
The handoff expands an interpreted run operation into the center stage, then
|
The handoff expands an interpreted run operation into the center stage, then
|
||||||
keeps one workflow graph mounted while execution reaches the typed interrupt
|
keeps one workflow graph mounted while execution reaches the typed interrupt
|
||||||
|
|||||||
@@ -4,7 +4,7 @@ import { afterEach, describe, expect, it, vi } from "vitest";
|
|||||||
import { loadCanonicalDemoRecording } from "../demo/timeline/replay.js";
|
import { loadCanonicalDemoRecording } from "../demo/timeline/replay.js";
|
||||||
import type { DemoTimelineController } from "../demo/useDemoTimeline.js";
|
import type { DemoTimelineController } from "../demo/useDemoTimeline.js";
|
||||||
import { SceneBody } from "./SceneBody.js";
|
import { SceneBody } from "./SceneBody.js";
|
||||||
import type { PresentationLocation } from "./storyboard.js";
|
import type { MainLocation, PresentationLocation } from "./storyboard.js";
|
||||||
import { findBeat, findScene } from "./storyboard.js";
|
import { findBeat, findScene } from "./storyboard.js";
|
||||||
|
|
||||||
const noop = () => {};
|
const noop = () => {};
|
||||||
@@ -39,7 +39,7 @@ const demo: DemoTimelineController = {
|
|||||||
|
|
||||||
afterEach(() => cleanup());
|
afterEach(() => cleanup());
|
||||||
|
|
||||||
const renderSceneBodyAtMainLocation = (sceneId: PresentationLocation["sceneId"], beatId: string, openDiscussion = noop) => render(
|
const renderSceneBodyAtMainLocation = (sceneId: MainLocation["sceneId"], beatId: string, openDiscussion = noop) => render(
|
||||||
<SceneBody
|
<SceneBody
|
||||||
location={{ kind: "main", sceneId, beatId, focusPath: [] }}
|
location={{ kind: "main", sceneId, beatId, focusPath: [] }}
|
||||||
demo={demo}
|
demo={demo}
|
||||||
|
|||||||
@@ -19,9 +19,18 @@ describe("presentation.css", () => {
|
|||||||
it("stacks evaluation audit rows at the 1080px container breakpoint", () => {
|
it("stacks evaluation audit rows at the 1080px container breakpoint", () => {
|
||||||
const breakpointBlock = css.match(/@media \(max-width: 1080px\) \{(?<body>[\s\S]*?)\n\}/)?.groups?.body;
|
const breakpointBlock = css.match(/@media \(max-width: 1080px\) \{(?<body>[\s\S]*?)\n\}/)?.groups?.body;
|
||||||
|
|
||||||
|
expect(breakpointBlock).toMatch(
|
||||||
|
/\.evaluation-board\s*\{\s*grid-template-columns: minmax\(12rem, 0\.7fr\) minmax\(20rem, 1\.3fr\);/,
|
||||||
|
);
|
||||||
expect(breakpointBlock).toMatch(/\.evaluation-board__audit-row\s*\{\s*grid-template-columns: 1fr;/);
|
expect(breakpointBlock).toMatch(/\.evaluation-board__audit-row\s*\{\s*grid-template-columns: 1fr;/);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it("keeps the full evaluation board available to the scrollable stage", () => {
|
||||||
|
const boardBlock = css.match(/\.evaluation-board\s*\{(?<body>[\s\S]*?)\n\}/)?.groups?.body;
|
||||||
|
|
||||||
|
expect(boardBlock).toContain("flex-shrink: 0");
|
||||||
|
});
|
||||||
|
|
||||||
it("places the conclusion evidence beneath substrate at the 1080px breakpoint", () => {
|
it("places the conclusion evidence beneath substrate at the 1080px breakpoint", () => {
|
||||||
expect(css).toMatch(/\.conclusion-map__node--planner\s*\{\s*grid-column: 1;\s*grid-row: 1;/);
|
expect(css).toMatch(/\.conclusion-map__node--planner\s*\{\s*grid-column: 1;\s*grid-row: 1;/);
|
||||||
expect(css).toMatch(/\.conclusion-map__node--substrate\s*\{\s*grid-column: 2;\s*grid-row: 1;/);
|
expect(css).toMatch(/\.conclusion-map__node--substrate\s*\{\s*grid-column: 2;\s*grid-row: 1;/);
|
||||||
@@ -30,6 +39,12 @@ describe("presentation.css", () => {
|
|||||||
expect(css).not.toMatch(/\.conclusion-map__node--runtime::after/);
|
expect(css).not.toMatch(/\.conclusion-map__node--runtime::after/);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it("uses a light foreground against the dark conclusion map", () => {
|
||||||
|
const mapBlock = css.match(/\.conclusion-map\s*\{(?<body>[\s\S]*?)\n\}/)?.groups?.body;
|
||||||
|
|
||||||
|
expect(mapBlock).toContain("color: oklch(0.93 0.015 250)");
|
||||||
|
});
|
||||||
|
|
||||||
it("keeps future-work icons neutral by default", () => {
|
it("keeps future-work icons neutral by default", () => {
|
||||||
expect(css).toMatch(/\.conclusion-map__future svg\s*\{[^}]*color: var\(--text-secondary\);/s);
|
expect(css).toMatch(/\.conclusion-map__future svg\s*\{[^}]*color: var\(--text-secondary\);/s);
|
||||||
expect(css).not.toMatch(/\.conclusion-map__future svg\s*\{[^}]*color: var\(--accent-cyan\);/s);
|
expect(css).not.toMatch(/\.conclusion-map__future svg\s*\{[^}]*color: var\(--accent-cyan\);/s);
|
||||||
|
|||||||
@@ -88,6 +88,8 @@
|
|||||||
grid-template-columns: minmax(14rem, 0.8fr) minmax(20rem, 1.2fr);
|
grid-template-columns: minmax(14rem, 0.8fr) minmax(20rem, 1.2fr);
|
||||||
gap: 0;
|
gap: 0;
|
||||||
margin: 0.25rem 0 0.5rem;
|
margin: 0.25rem 0 0.5rem;
|
||||||
|
/* Let the primary stage scroll at 4:3 instead of clipping board rows. */
|
||||||
|
flex-shrink: 0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
border: 1px solid var(--evaluation-rule);
|
border: 1px solid var(--evaluation-rule);
|
||||||
border-radius: 0.35rem;
|
border-radius: 0.35rem;
|
||||||
@@ -217,10 +219,10 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 1080px) {
|
@media (max-width: 1080px) {
|
||||||
.evaluation-board { grid-template-columns: 1fr; }
|
.evaluation-board { grid-template-columns: minmax(12rem, 0.7fr) minmax(20rem, 1.3fr); }
|
||||||
.evaluation-board__cohort { border-right: 0; }
|
.evaluation-board__cohort { border-right: 1px solid var(--evaluation-rule); }
|
||||||
.evaluation-board__outcomes,
|
.evaluation-board__outcomes,
|
||||||
.evaluation-board__findings { grid-column: auto; }
|
.evaluation-board__findings { grid-column: 2; }
|
||||||
.evaluation-board__audit-row { grid-template-columns: 1fr; }
|
.evaluation-board__audit-row { grid-template-columns: 1fr; }
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -268,6 +270,7 @@
|
|||||||
border: 1px solid var(--stage-line);
|
border: 1px solid var(--stage-line);
|
||||||
border-radius: 0.45rem;
|
border-radius: 0.45rem;
|
||||||
background: linear-gradient(135deg, oklch(0.17 0.03 250), oklch(0.13 0.025 250));
|
background: linear-gradient(135deg, oklch(0.17 0.03 250), oklch(0.13 0.025 250));
|
||||||
|
color: oklch(0.93 0.015 250);
|
||||||
}
|
}
|
||||||
|
|
||||||
.conclusion-map__flow {
|
.conclusion-map__flow {
|
||||||
|
|||||||
Reference in New Issue
Block a user