fix: harden prepared lifecycle review fixes
This commit is contained in:
@@ -43,6 +43,7 @@ describe("PreparedAuthoringLifecycleScene", () => {
|
|||||||
expect(frame).toHaveTextContent("wf draft validate lda_report_workflow");
|
expect(frame).toHaveTextContent("wf draft validate lda_report_workflow");
|
||||||
expect(frame).toHaveTextContent(/structured missing-output diagnostic/i);
|
expect(frame).toHaveTextContent(/structured missing-output diagnostic/i);
|
||||||
expect(frame).toHaveAttribute("data-authoring-step", "diagnose");
|
expect(frame).toHaveAttribute("data-authoring-step", "diagnose");
|
||||||
|
expect(frame.querySelector('[data-authoring-focus="diagnose"]')).toBeInTheDocument();
|
||||||
expect(screen.getByRole("region", { name: "validation repair evidence" })).toHaveAttribute(
|
expect(screen.getByRole("region", { name: "validation repair evidence" })).toHaveAttribute(
|
||||||
"data-authoring-focus",
|
"data-authoring-focus",
|
||||||
"diagnose",
|
"diagnose",
|
||||||
@@ -60,6 +61,7 @@ describe("PreparedAuthoringLifecycleScene", () => {
|
|||||||
expect(frame).toHaveTextContent("workflow.draft_workspaces.set_step_output_map");
|
expect(frame).toHaveTextContent("workflow.draft_workspaces.set_step_output_map");
|
||||||
expect(frame).toHaveTextContent(/wf draft set-output lda_report_workflow/i);
|
expect(frame).toHaveTextContent(/wf draft set-output lda_report_workflow/i);
|
||||||
expect(frame).toHaveAttribute("data-authoring-step", "repair");
|
expect(frame).toHaveAttribute("data-authoring-step", "repair");
|
||||||
|
expect(frame.querySelector('[data-authoring-focus="repair"]')).toBeInTheDocument();
|
||||||
expect(screen.getByRole("region", { name: "validation repair evidence" })).toHaveAttribute(
|
expect(screen.getByRole("region", { name: "validation repair evidence" })).toHaveAttribute(
|
||||||
"data-authoring-focus",
|
"data-authoring-focus",
|
||||||
"repair",
|
"repair",
|
||||||
|
|||||||
@@ -12,7 +12,6 @@ import {
|
|||||||
preparedLifecycleMessageReducer,
|
preparedLifecycleMessageReducer,
|
||||||
} from "./prepared-lifecycle-message-state.js";
|
} from "./prepared-lifecycle-message-state.js";
|
||||||
import type { SceneBeatDefinition, SceneDefinition } from "../storyboard.js";
|
import type { SceneBeatDefinition, SceneDefinition } from "../storyboard.js";
|
||||||
import { StageCaption } from "../StageCaption.js";
|
|
||||||
|
|
||||||
type PreparedAuthoringLifecycleSceneProps = {
|
type PreparedAuthoringLifecycleSceneProps = {
|
||||||
readonly scene: SceneDefinition;
|
readonly scene: SceneDefinition;
|
||||||
@@ -34,12 +33,12 @@ const steps = [
|
|||||||
}[];
|
}[];
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Scene 9 — Prepared workflow authoring lifecycle.
|
* Prepared workflow authoring lifecycle.
|
||||||
*
|
*
|
||||||
* Each beat shows a persistent prepared assistant beside one dominant phase
|
* Each beat shows a persistent prepared assistant beside one dominant phase
|
||||||
* projection sourced from the prepared authoring recording.
|
* projection sourced from the prepared authoring recording.
|
||||||
*/
|
*/
|
||||||
export const PreparedAuthoringLifecycleScene = ({ scene, beat, onAdvance }: PreparedAuthoringLifecycleSceneProps) => {
|
export const PreparedAuthoringLifecycleScene = ({ beat, onAdvance }: PreparedAuthoringLifecycleSceneProps) => {
|
||||||
const [messageState, dispatch] = useReducer(
|
const [messageState, dispatch] = useReducer(
|
||||||
preparedLifecycleMessageReducer,
|
preparedLifecycleMessageReducer,
|
||||||
initialPreparedLifecycleMessageState,
|
initialPreparedLifecycleMessageState,
|
||||||
@@ -51,89 +50,83 @@ export const PreparedAuthoringLifecycleScene = ({ scene, beat, onAdvance }: Prep
|
|||||||
const projection = projectPreparedLifecycleStep(step);
|
const projection = projectPreparedLifecycleStep(step);
|
||||||
const activeStepIndex = steps.findIndex((candidate) => candidate.id === step);
|
const activeStepIndex = steps.findIndex((candidate) => candidate.id === step);
|
||||||
return (
|
return (
|
||||||
<>
|
<section
|
||||||
{/* Keep external chrome to scene orientation; beat-specific copy belongs in the frame. */}
|
className="prepared-lifecycle-scene"
|
||||||
<StageCaption eyebrow="Prepared workflow" title={scene.title}>
|
aria-label="prepared workflow authoring lifecycle"
|
||||||
{null}
|
data-active-phase={step}
|
||||||
</StageCaption>
|
data-recording-phase={projection.recordingPhase}
|
||||||
<section
|
data-primary-surface="authoring-phase"
|
||||||
className="prepared-lifecycle-scene"
|
data-support-surface="prepared-chat"
|
||||||
aria-label="prepared workflow authoring lifecycle"
|
data-presentation-surface="editorial"
|
||||||
data-active-phase={step}
|
>
|
||||||
data-recording-phase={projection.recordingPhase}
|
<PresentationAssistantPane
|
||||||
data-primary-surface="authoring-phase"
|
phase={step}
|
||||||
data-support-surface="prepared-chat"
|
visualRole="support"
|
||||||
data-presentation-surface="editorial"
|
message={projectPreparedLifecycleMessage(messageState, step)}
|
||||||
>
|
submittedOverrides={projectPreparedLifecycleSubmittedOverrides(messageState)}
|
||||||
<PresentationAssistantPane
|
runRequested={messageState.runRequested}
|
||||||
phase={step}
|
onDraftChange={(draft) => dispatch({ type: "draft_edited", draft })}
|
||||||
visualRole="support"
|
onSubmit={(submittedText) => {
|
||||||
message={projectPreparedLifecycleMessage(messageState, step)}
|
dispatch({ type: "draft_edited", draft: submittedText });
|
||||||
submittedOverrides={projectPreparedLifecycleSubmittedOverrides(messageState)}
|
if (step === "discover") {
|
||||||
runRequested={messageState.runRequested}
|
dispatch({ type: "discover_submitted" });
|
||||||
onDraftChange={(draft) => dispatch({ type: "draft_edited", draft })}
|
}
|
||||||
onSubmit={(submittedText) => {
|
if (step === "draft") {
|
||||||
dispatch({ type: "draft_edited", draft: submittedText });
|
dispatch({ type: "draft_submitted" });
|
||||||
if (step === "discover") {
|
onAdvance?.();
|
||||||
dispatch({ type: "discover_submitted" });
|
}
|
||||||
}
|
if (step === "artifact") {
|
||||||
if (step === "draft") {
|
dispatch({ type: "artifact_submitted" });
|
||||||
dispatch({ type: "draft_submitted" });
|
onAdvance?.();
|
||||||
onAdvance?.();
|
}
|
||||||
}
|
if (step === "deployment") dispatch({ type: "run_requested" });
|
||||||
if (step === "artifact") {
|
}}
|
||||||
dispatch({ type: "artifact_submitted" });
|
/>
|
||||||
onAdvance?.();
|
<div className="prepared-lifecycle-scene__presentation">
|
||||||
}
|
<ol className="prepared-lifecycle-scene__rail" aria-label="prepared authoring lifecycle">
|
||||||
if (step === "deployment") dispatch({ type: "run_requested" });
|
{steps.map((candidate, index) => (
|
||||||
}}
|
<li
|
||||||
/>
|
key={candidate.id}
|
||||||
<div className="prepared-lifecycle-scene__presentation">
|
data-active={candidate.id === step ? "true" : "false"}
|
||||||
<ol className="prepared-lifecycle-scene__rail" aria-label="prepared authoring lifecycle">
|
data-complete={index < activeStepIndex ? "true" : "false"}
|
||||||
{steps.map((candidate, index) => (
|
>
|
||||||
<li
|
<span className="prepared-lifecycle-scene__ordinal" aria-hidden="true">
|
||||||
key={candidate.id}
|
{String(index + 1).padStart(2, "0")}
|
||||||
data-active={candidate.id === step ? "true" : "false"}
|
</span>
|
||||||
data-complete={index < activeStepIndex ? "true" : "false"}
|
<strong>{candidate.label}</strong>
|
||||||
>
|
<span className="prepared-lifecycle-scene__detail">{candidate.detail}</span>
|
||||||
<span className="prepared-lifecycle-scene__ordinal" aria-hidden="true">
|
</li>
|
||||||
{String(index + 1).padStart(2, "0")}
|
))}
|
||||||
</span>
|
</ol>
|
||||||
<strong>{candidate.label}</strong>
|
|
||||||
<span className="prepared-lifecycle-scene__detail">{candidate.detail}</span>
|
|
||||||
</li>
|
|
||||||
))}
|
|
||||||
</ol>
|
|
||||||
|
|
||||||
<article
|
<article
|
||||||
className="prepared-lifecycle-scene__frame"
|
className="prepared-lifecycle-scene__frame"
|
||||||
role="region"
|
role="region"
|
||||||
aria-label="active authoring operation"
|
aria-label="active authoring operation"
|
||||||
data-authoring-step={step}
|
data-authoring-step={step}
|
||||||
data-recording-phase={projection.recordingPhase}
|
data-recording-phase={projection.recordingPhase}
|
||||||
data-visual-role="lifecycle-primary"
|
data-visual-role="lifecycle-primary"
|
||||||
>
|
>
|
||||||
<header className="prepared-lifecycle-scene__frame-header">
|
<header className="prepared-lifecycle-scene__frame-header">
|
||||||
|
<div>
|
||||||
|
<span className="prepared-lifecycle-scene__frame-step">{activeStep.label}</span>
|
||||||
|
<h2>{beat.title}</h2>
|
||||||
|
<p>{beat.caption}</p>
|
||||||
|
</div>
|
||||||
|
<dl className="prepared-lifecycle-scene__evidence">
|
||||||
<div>
|
<div>
|
||||||
<span className="prepared-lifecycle-scene__frame-step">{activeStep.label}</span>
|
<dt>Method</dt>
|
||||||
<h2>{beat.title}</h2>
|
<dd><code>{projection.primaryCommand.title}</code></dd>
|
||||||
<p>{beat.caption}</p>
|
|
||||||
</div>
|
</div>
|
||||||
<dl className="prepared-lifecycle-scene__evidence">
|
<div>
|
||||||
<div>
|
<dt>Equivalent CLI</dt>
|
||||||
<dt>Method</dt>
|
<dd><code>{projection.primaryCommand.command}</code></dd>
|
||||||
<dd><code>{projection.primaryCommand.title}</code></dd>
|
</div>
|
||||||
</div>
|
</dl>
|
||||||
<div>
|
</header>
|
||||||
<dt>Equivalent CLI</dt>
|
<AuthoringPhaseVisual projection={projection} focus={projection.focus} />
|
||||||
<dd><code>{projection.primaryCommand.command}</code></dd>
|
</article>
|
||||||
</div>
|
</div>
|
||||||
</dl>
|
</section>
|
||||||
</header>
|
|
||||||
<AuthoringPhaseVisual projection={projection} focus={projection.focus} />
|
|
||||||
</article>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</>
|
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -84,7 +84,7 @@ describe("presentation.css", () => {
|
|||||||
expect(boardBlock).toContain("flex-shrink: 0");
|
expect(boardBlock).toContain("flex-shrink: 0");
|
||||||
});
|
});
|
||||||
|
|
||||||
it("keeps Scene 9 as a bounded 26/74 split without a lower dock row", () => {
|
it("keeps the prepared lifecycle as a bounded 26/74 split without a lower dock row", () => {
|
||||||
const sceneBlock = css.match(
|
const sceneBlock = css.match(
|
||||||
/^\.prepared-lifecycle-scene\s*\{(?<body>[\s\S]*?)\n\}/m,
|
/^\.prepared-lifecycle-scene\s*\{(?<body>[\s\S]*?)\n\}/m,
|
||||||
)?.groups?.body;
|
)?.groups?.body;
|
||||||
@@ -98,12 +98,39 @@ describe("presentation.css", () => {
|
|||||||
expect(css).not.toMatch(/prepared-lifecycle-scene__dock[\s\S]*position:\s*(absolute|fixed)/);
|
expect(css).not.toMatch(/prepared-lifecycle-scene__dock[\s\S]*position:\s*(absolute|fixed)/);
|
||||||
});
|
});
|
||||||
|
|
||||||
it("keeps every Scene 9 surface override on the editorial 26/74 split", () => {
|
it("asserts the winning editorial 26/74 split", () => {
|
||||||
const scene9Rules = css.match(/\.prepared-lifecycle-scene[^{}]*\{[^}]*\}/g) ?? [];
|
const editorialScene = cssBlocks(
|
||||||
|
css,
|
||||||
|
'.prepared-lifecycle-scene[data-presentation-surface="editorial"]',
|
||||||
|
).find((body) => body.includes("--authoring-paper") && body.includes("grid-template-columns:"));
|
||||||
|
|
||||||
expect(scene9Rules.filter((rule) => rule.includes("grid-template-columns:")).length).toBeGreaterThan(0);
|
expect(editorialScene).toBeDefined();
|
||||||
expect(scene9Rules.join("\n")).not.toContain("1.65fr");
|
expect(editorialScene).toMatch(/grid-template-columns: minmax\(12rem, 0\.26fr\) minmax\(0, 0\.74fr\)/);
|
||||||
expect(scene9Rules.join("\n")).toMatch(/minmax\(12rem, 0\.26fr\)\s+minmax\(0, 0\.74fr\)/);
|
expect(editorialScene).not.toContain("0.24fr");
|
||||||
|
expect(editorialScene).not.toContain("0.76fr");
|
||||||
|
});
|
||||||
|
|
||||||
|
it("scopes Diagnose and Repair focus styling to the prepared lifecycle frame", () => {
|
||||||
|
const preparedFrame = '.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame';
|
||||||
|
const diagnose = cssBlocks(css, `${preparedFrame} .authoring-visual--repair[data-authoring-focus="diagnose"]`)
|
||||||
|
.find((body) => body.includes("grid-template-columns: minmax(0, 1fr);"));
|
||||||
|
const repair = cssBlocks(css, `${preparedFrame} .authoring-visual--repair[data-authoring-focus="repair"]`)
|
||||||
|
.find((body) => body.includes("grid-template-columns: minmax(0, 1fr);"));
|
||||||
|
const diagnoseEvidence = cssBlocks(
|
||||||
|
css,
|
||||||
|
`${preparedFrame} .authoring-visual--repair[data-authoring-focus="diagnose"] .authoring-repair__diagnostic`,
|
||||||
|
).find((body) => body.includes("border-inline-start: 3px solid"));
|
||||||
|
const repairEvidence = cssBlocks(
|
||||||
|
css,
|
||||||
|
`${preparedFrame} .authoring-visual--repair[data-authoring-focus="repair"] .authoring-repair__correction`,
|
||||||
|
).find((body) => body.includes("border-inline-start: 3px solid"));
|
||||||
|
|
||||||
|
expect(diagnose).toContain("grid-template-columns: minmax(0, 1fr);");
|
||||||
|
expect(diagnoseEvidence).toContain("border-inline-start: 3px solid");
|
||||||
|
expect(repair).toContain("grid-template-columns: minmax(0, 1fr);");
|
||||||
|
expect(repairEvidence).toContain("border-inline-start: 3px solid");
|
||||||
|
expect(css).toContain(`${preparedFrame} .authoring-visual--repair[data-authoring-focus="diagnose"] .authoring-repair__correction`);
|
||||||
|
expect(css).toContain(`${preparedFrame} .authoring-visual--repair[data-authoring-focus="repair"] .authoring-repair__status`);
|
||||||
});
|
});
|
||||||
|
|
||||||
it("gives the prepared lifecycle rail and operation frame the primary hierarchy", () => {
|
it("gives the prepared lifecycle rail and operation frame the primary hierarchy", () => {
|
||||||
@@ -135,7 +162,33 @@ describe("presentation.css", () => {
|
|||||||
expect(compactRail).toContain("scrollbar-width: none;");
|
expect(compactRail).toContain("scrollbar-width: none;");
|
||||||
});
|
});
|
||||||
|
|
||||||
it("bounds Scene 9 conversation scrolling and recenters Scene 8 at compact stage widths", () => {
|
it("keeps the operation frame readable at 720px and stacks presentation at 480px", () => {
|
||||||
|
const compactContainer = cssBlock(css, "@container presentation-canvas (max-width: 1050px)") ?? "";
|
||||||
|
const compactScene = cssBlocks(compactContainer, '.prepared-lifecycle-scene[data-presentation-surface="editorial"]')
|
||||||
|
.find((body) => body.includes("grid-template-columns: minmax(10.5rem, 0.28fr)"));
|
||||||
|
const compactFrame = cssBlocks(
|
||||||
|
compactContainer,
|
||||||
|
'.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame',
|
||||||
|
).find((body) => body.includes("grid-template-rows: auto auto;"));
|
||||||
|
const compactRepair = cssBlocks(
|
||||||
|
compactContainer,
|
||||||
|
'.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-visual--repair',
|
||||||
|
).find((body) => body.includes("grid-template-columns: minmax(0, 1fr);"));
|
||||||
|
const narrowContainer = cssBlock(css, "@container presentation-canvas (max-width: 600px)") ?? "";
|
||||||
|
const narrowScene = cssBlocks(narrowContainer, ".prepared-lifecycle-scene")
|
||||||
|
.find((body) => body.includes("grid-template-columns: minmax(0, 1fr);") && body.includes("grid-template-areas:"));
|
||||||
|
|
||||||
|
expect(compactScene).toContain("overflow: visible;");
|
||||||
|
expect(compactFrame).toContain("grid-template-rows: auto auto;");
|
||||||
|
expect(compactFrame).toContain("min-height: 18rem;");
|
||||||
|
expect(compactFrame).toContain("overflow: visible;");
|
||||||
|
expect(compactRepair).toContain("grid-template-columns: minmax(0, 1fr);");
|
||||||
|
expect(compactRepair).toContain("min-width: 0;");
|
||||||
|
expect(narrowScene).toContain("grid-template-columns: minmax(0, 1fr);");
|
||||||
|
expect(narrowScene).toContain('grid-template-areas: "presentation" "assistant";');
|
||||||
|
});
|
||||||
|
|
||||||
|
it("bounds prepared conversation scrolling and recenters the agent handoff at compact stage widths", () => {
|
||||||
expect(css.match(/\.presentation-stage\[data-scene-view="agent"\] \.presentation-stage__primary\s*\{/g)).toHaveLength(2);
|
expect(css.match(/\.presentation-stage\[data-scene-view="agent"\] \.presentation-stage__primary\s*\{/g)).toHaveLength(2);
|
||||||
expect(cssBlocks(css, ".presentation-stage__primary > .agent-handoff-scene")
|
expect(cssBlocks(css, ".presentation-stage__primary > .agent-handoff-scene")
|
||||||
.some((body) => body.includes("margin-inline: auto;"))).toBe(true);
|
.some((body) => body.includes("margin-inline: auto;"))).toBe(true);
|
||||||
|
|||||||
@@ -3674,7 +3674,7 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Scene 9 — persistent assistant beside the dominant phase projection. */
|
/* Prepared lifecycle — persistent assistant beside the dominant phase frame. */
|
||||||
.prepared-lifecycle-scene {
|
.prepared-lifecycle-scene {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: minmax(12rem, 0.26fr) minmax(0, 0.74fr);
|
grid-template-columns: minmax(12rem, 0.26fr) minmax(0, 0.74fr);
|
||||||
@@ -3831,20 +3831,6 @@
|
|||||||
font: 600 0.72rem/1.3 var(--font-mono);
|
font: 600 0.72rem/1.3 var(--font-mono);
|
||||||
}
|
}
|
||||||
|
|
||||||
.stage-caption:has(+ .prepared-lifecycle-scene) {
|
|
||||||
margin-bottom: 0.55rem;
|
|
||||||
padding: 0.75rem 1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.stage-caption:has(+ .prepared-lifecycle-scene) h1 {
|
|
||||||
margin-block: 0.15rem 0.25rem;
|
|
||||||
font-size: 1.85rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.stage-caption:has(+ .prepared-lifecycle-scene) p {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.presentation-assistant-pane {
|
.presentation-assistant-pane {
|
||||||
display: flex;
|
display: flex;
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
@@ -3945,7 +3931,7 @@
|
|||||||
--authoring-ink: var(--color-editorial-ink, oklch(0.19 0.015 65));
|
--authoring-ink: var(--color-editorial-ink, oklch(0.19 0.015 65));
|
||||||
--authoring-muted: var(--color-editorial-muted, oklch(0.48 0.025 65));
|
--authoring-muted: var(--color-editorial-muted, oklch(0.48 0.025 65));
|
||||||
--authoring-rule: color-mix(in oklch, var(--authoring-muted) 32%, transparent);
|
--authoring-rule: color-mix(in oklch, var(--authoring-muted) 32%, transparent);
|
||||||
grid-template-columns: minmax(12rem, 0.24fr) minmax(0, 0.76fr);
|
grid-template-columns: minmax(12rem, 0.26fr) minmax(0, 0.74fr);
|
||||||
gap: 0.8rem;
|
gap: 0.8rem;
|
||||||
background: var(--authoring-paper);
|
background: var(--authoring-paper);
|
||||||
color: var(--authoring-ink);
|
color: var(--authoring-ink);
|
||||||
@@ -4016,6 +4002,52 @@
|
|||||||
color: var(--authoring-muted);
|
color: var(--authoring-muted);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Diagnose and Repair are distinct editorial cuts of the recorded validate phase. */
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-visual--repair[data-authoring-focus="diagnose"] {
|
||||||
|
grid-template-columns: minmax(0, 1fr);
|
||||||
|
grid-template-rows: auto;
|
||||||
|
align-content: start;
|
||||||
|
gap: 0.75rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-visual--repair[data-authoring-focus="diagnose"] .authoring-repair__diagnostic {
|
||||||
|
grid-column: 1;
|
||||||
|
min-height: 0;
|
||||||
|
border-inline-start: 3px solid var(--accent-amber);
|
||||||
|
background: color-mix(in oklch, var(--authoring-paper) 90%, var(--accent-amber));
|
||||||
|
}
|
||||||
|
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-visual--repair[data-authoring-focus="diagnose"] .authoring-repair__connector,
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-visual--repair[data-authoring-focus="diagnose"] .authoring-repair__correction,
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-visual--repair[data-authoring-focus="diagnose"] .authoring-repair__status {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-visual--repair[data-authoring-focus="repair"] {
|
||||||
|
grid-template-columns: minmax(0, 1fr);
|
||||||
|
grid-template-rows: auto;
|
||||||
|
align-content: start;
|
||||||
|
gap: 0.75rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-visual--repair[data-authoring-focus="repair"] .authoring-repair__diagnostic,
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-visual--repair[data-authoring-focus="repair"] .authoring-repair__connector {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-visual--repair[data-authoring-focus="repair"] .authoring-repair__correction {
|
||||||
|
grid-column: 1;
|
||||||
|
min-height: 0;
|
||||||
|
border-inline-start: 3px solid var(--success);
|
||||||
|
background: color-mix(in oklch, var(--authoring-paper) 90%, var(--success));
|
||||||
|
}
|
||||||
|
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-visual--repair[data-authoring-focus="repair"] .authoring-repair__status {
|
||||||
|
grid-column: 1;
|
||||||
|
justify-content: flex-start;
|
||||||
|
color: var(--success);
|
||||||
|
}
|
||||||
|
|
||||||
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .presentation-assistant-pane {
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .presentation-assistant-pane {
|
||||||
background: color-mix(in oklch, var(--authoring-paper) 92%, var(--authoring-muted));
|
background: color-mix(in oklch, var(--authoring-paper) 92%, var(--authoring-muted));
|
||||||
border-color: var(--authoring-rule);
|
border-color: var(--authoring-rule);
|
||||||
@@ -4107,6 +4139,7 @@
|
|||||||
.prepared-lifecycle-scene[data-presentation-surface="editorial"] {
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] {
|
||||||
grid-template-columns: minmax(10.5rem, 0.28fr) minmax(0, 0.72fr);
|
grid-template-columns: minmax(10.5rem, 0.28fr) minmax(0, 0.72fr);
|
||||||
gap: 0.6rem;
|
gap: 0.6rem;
|
||||||
|
overflow: visible;
|
||||||
}
|
}
|
||||||
|
|
||||||
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__rail {
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__rail {
|
||||||
@@ -4118,7 +4151,16 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame {
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame {
|
||||||
|
grid-template-rows: auto auto;
|
||||||
|
min-height: 18rem;
|
||||||
|
height: auto;
|
||||||
padding: 0.9rem;
|
padding: 0.9rem;
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__presentation {
|
||||||
|
min-height: max-content;
|
||||||
|
overflow: visible;
|
||||||
}
|
}
|
||||||
|
|
||||||
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame-header {
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame-header {
|
||||||
@@ -4126,6 +4168,37 @@
|
|||||||
gap: 0.7rem;
|
gap: 0.7rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-visual--repair {
|
||||||
|
grid-template-columns: minmax(0, 1fr);
|
||||||
|
grid-template-rows: auto;
|
||||||
|
width: 100%;
|
||||||
|
min-width: 0;
|
||||||
|
height: auto;
|
||||||
|
gap: 0.7rem;
|
||||||
|
align-content: start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-repair__diagnostic,
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-repair__correction {
|
||||||
|
min-width: 0;
|
||||||
|
min-height: 0;
|
||||||
|
padding: 0.85rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-repair__connector {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-repair__status {
|
||||||
|
grid-column: 1;
|
||||||
|
justify-content: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-repair__diagnostic strong,
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] .prepared-lifecycle-scene__frame .authoring-repair__correction code {
|
||||||
|
overflow-wrap: anywhere;
|
||||||
|
}
|
||||||
|
|
||||||
.problem-loop-scene[data-presentation-surface="editorial"] {
|
.problem-loop-scene[data-presentation-surface="editorial"] {
|
||||||
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
|
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@@ -4143,6 +4216,23 @@
|
|||||||
to { opacity: 1; }
|
to { opacity: 1; }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@container presentation-canvas (max-width: 600px) {
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] {
|
||||||
|
grid-template-columns: minmax(0, 1fr);
|
||||||
|
grid-template-areas: "presentation" "assistant";
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] > .prepared-lifecycle-scene__presentation {
|
||||||
|
grid-area: presentation;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prepared-lifecycle-scene[data-presentation-surface="editorial"] > .presentation-assistant-pane {
|
||||||
|
grid-area: assistant;
|
||||||
|
min-height: 14rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@media (prefers-reduced-motion: reduce) {
|
@media (prefers-reduced-motion: reduce) {
|
||||||
.prepared-lifecycle-scene__frame > * {
|
.prepared-lifecycle-scene__frame > * {
|
||||||
animation: none;
|
animation: none;
|
||||||
|
|||||||
Reference in New Issue
Block a user