feat: add runPath and runCwd to DocCommand and DocData interfaces

chore: remove obsolete .last-run.json file from test results

test: add error context for terminal behavior during long output rendering

test: add error context for terminal rendering of ANSI colors split across chunks

test: add error context for terminal rendering with leaking raw HTML markup

test: add error context for terminal rendering of template source text

test: add error context for terminal switching command and showing new output

test: add error context for terminal virtualization of rendered lines during scrolling

docs: update lessons with new rules for project-scoped test runs

docs: add new tasks for Food Guru ingredient editing implementation

Author: RoenLie

apps/food-guru/client/package.json

@@ -9,6 +9,7 @@
 		"preview": "vite preview"
 	},
 	"dependencies": {
+		"@arcmantle/chronicle": "workspace:^",
 		"@arcmantle/pivot-client-router": "workspace:^",
 		"lit": "catalog:apps",
 		"tslib": "catalog:apps"

apps/food-guru/client/src/components/food-guru-layout.ts

@@ -154,12 +154,15 @@ export class FoodGuruLayout extends LitElement {
 
 	static override styles = css`
 		:host {
-			--fg-bg: #f4f6f8;
-			--fg-surface: #ffffff;
-			--fg-border: #dde3ea;
-			--fg-text: #10243a;
-			--fg-text-muted: #58708a;
-			--fg-primary: #2f7ad6;
+			--fg-bg: #0f131a;
+			--fg-surface: #161d27;
+			--fg-surface-soft: #1c2430;
+			--fg-border: #2a3645;
+			--fg-text: #e7edf5;
+			--fg-text-muted: #9cb0c6;
+			--fg-primary: #6ea8ff;
+			--fg-primary-soft: #223754;
+			color-scheme: dark;
 			display: flex;
 			flex-direction: column;
 			min-height: 100vh;
@@ -199,11 +202,11 @@ export class FoodGuruLayout extends LitElement {
 				font-size: 14px;
 				font-weight: 500;
 				&:hover {
-					background: #eff4fb;
+					background: var(--fg-surface-soft);
 					color: var(--fg-primary);
 				}
 				&[data-active] {
-					background: #e9f2ff;
+					background: var(--fg-primary-soft);
 					color: var(--fg-primary);
 				}
 			}
@@ -232,13 +235,15 @@ export class FoodGuruLayout extends LitElement {
 			padding: 8px 16px;
 			font-size: 13px;
 			color: var(--fg-primary);
-			background: #e9f2ff;
+			background: var(--fg-primary-soft);
 			border-bottom: 1px solid var(--fg-border);
 		}
 		main {
 			flex: 1;
 			display: grid;
-			padding: 16px;
+			padding: 0;
+			min-height: 0;
+			overflow: hidden;
 		}
 	`;
 

apps/food-guru/client/src/global.css

@@ -0,0 +1,38 @@
+html,
+body {
+	margin: 0;
+	padding: 0;
+	width: 100%;
+	height: 100%;
+	overflow: hidden;
+}
+
+body {
+	background: #0f131a;
+	color: #e7edf5;
+}
+
+
+/* must define property to work properly for all browsers */
+@property --wc-loaded {
+  syntax: "<number>";
+  inherits: true;
+  initial-value: 0;
+}
+
+body {
+  /* start timeout regardless if there are undefined components */
+  animation: showBody 0s linear 200ms forwards;
+
+  /* if there are undefined components, hide until defined or 200ms - whichever comes first */
+  &:has(:not(:defined)) {
+    opacity: var(--wc-loaded, 0);
+  }
+}
+
+/* update variable to prevent opactity flash for subsequent component loads */
+@keyframes showBody {
+  to {
+    --wc-loaded: 1;
+  }
+}

apps/food-guru/client/src/main.ts

@@ -1,3 +1,4 @@
+import './global.css';
 import './app.ts';