fix: reset conclusion map on mobile
This commit is contained in:
@@ -124,3 +124,51 @@ $ tsc -b --pretty false
|
||||
git diff --check
|
||||
passed
|
||||
```
|
||||
|
||||
## Final Responsive Fix
|
||||
|
||||
### RED
|
||||
|
||||
Command:
|
||||
|
||||
```text
|
||||
pnpm --dir web --filter @lda/console test -- src/presentation/presentation-css.test.ts
|
||||
```
|
||||
|
||||
Result:
|
||||
|
||||
```text
|
||||
Test Files 1 failed (1)
|
||||
Tests 1 failed, 4 passed (5)
|
||||
```
|
||||
|
||||
The failure was the missing 640px explicit placement reset and stale generic connector selector.
|
||||
|
||||
### GREEN
|
||||
|
||||
Command:
|
||||
|
||||
```text
|
||||
pnpm --dir web --filter @lda/console test -- src/presentation/presentation-css.test.ts
|
||||
```
|
||||
|
||||
Result:
|
||||
|
||||
```text
|
||||
Test Files 1 passed (1)
|
||||
Tests 5 passed (5)
|
||||
```
|
||||
|
||||
### Final Verification
|
||||
|
||||
```text
|
||||
pnpm --dir web --filter @lda/console test -- src/presentation/conclusion/conclusion-model.test.ts src/presentation/conclusion/ConclusionScene.test.tsx
|
||||
Test Files 2 passed (2)
|
||||
Tests 12 passed (12)
|
||||
|
||||
pnpm --dir web --filter @lda/console typecheck
|
||||
$ tsc -b --pretty false
|
||||
|
||||
git diff --check
|
||||
passed
|
||||
```
|
||||
|
||||
@@ -34,4 +34,11 @@ describe("presentation.css", () => {
|
||||
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);
|
||||
});
|
||||
|
||||
it("resets conclusion node placement and keeps connectors node-specific on narrow screens", () => {
|
||||
expect(css).toMatch(
|
||||
/@media \(max-width: 640px\) \{[\s\S]*?\.conclusion-map__node--planner,\s*\.conclusion-map__node--substrate,\s*\.conclusion-map__node--runtime,\s*\.conclusion-map__node--evidence\s*\{\s*grid-column: auto;\s*grid-row: auto;/,
|
||||
);
|
||||
expect(css).not.toContain(".conclusion-map__node:not(:last-child)::after");
|
||||
});
|
||||
});
|
||||
|
||||
@@ -392,7 +392,16 @@
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.conclusion-map__flow { grid-template-columns: 1fr; gap: 0.85rem; }
|
||||
.conclusion-map__node:not(:last-child)::after {
|
||||
.conclusion-map__node--planner,
|
||||
.conclusion-map__node--substrate,
|
||||
.conclusion-map__node--runtime,
|
||||
.conclusion-map__node--evidence {
|
||||
grid-column: auto;
|
||||
grid-row: auto;
|
||||
}
|
||||
|
||||
.conclusion-map__node--planner::after,
|
||||
.conclusion-map__node--substrate::after {
|
||||
top: auto;
|
||||
right: 50%;
|
||||
bottom: -0.85rem;
|
||||
|
||||
Reference in New Issue
Block a user