From 37745d0fe44101d42c675c91d30a95449d1d8ded Mon Sep 17 00:00:00 2001 From: OpenVelo Agent Date: Wed, 22 Jul 2026 09:23:34 +0000 Subject: [PATCH] docs: update documentation to OKF v0.1 format --- docs/architecture/frontend-structure.md | 4 ++-- docs/guides/authenticated-shell.md | 12 ++++-------- docs/index.md | 2 +- 3 files changed, 7 insertions(+), 11 deletions(-) diff --git a/docs/architecture/frontend-structure.md b/docs/architecture/frontend-structure.md index 442c4d7..48f6a5c 100644 --- a/docs/architecture/frontend-structure.md +++ b/docs/architecture/frontend-structure.md @@ -3,7 +3,7 @@ type: architecture title: Frontend Structure description: Angular routes, components, services, guards, interceptors, and authenticated SSE transport. tags: [architecture, frontend, angular, shell, sse] -timestamp: 2026-07-21T23:25:00Z +timestamp: 2026-07-22T09:22:34Z --- # Routes @@ -25,7 +25,7 @@ Routes live in `frontend/src/app/app.routes.ts`: | Symbol | Path | Responsibility | |---|---|---| | `HomeComponent` | `frontend/src/app/features/home/home.component.ts` | Smart shell; owns navigation signals, user hydration, change-password flow, and event-stream lifecycle. | -| `ShellHeaderComponent` | `frontend/src/app/features/shell/header/shell-header.component.ts` | Renders title, active section, event LED/countdown, and user menu. | +| `ShellHeaderComponent` | `frontend/src/app/features/shell/header/shell-header.component.ts` | Renders title, active section, event LED/countdown, and user menu; contains component-scoped LED styling. | | `QuickTabsComponent` | `frontend/src/app/features/shell/tabs/quick-tabs.component.ts` | Emits navigation events for Challenges, Scoreboard, and Blog. | | `EventStatusStore` | `frontend/src/app/core/services/event-status.store.ts` | Applies event state frames and computes countdown text. | | `AuthenticatedEventSourceService` | `frontend/src/app/core/services/authenticated-event-source.service.ts` | Opens authenticated SSE over `fetch`, parsing streamed frames into `EventSourceLike` events. | diff --git a/docs/guides/authenticated-shell.md b/docs/guides/authenticated-shell.md index efa39b8..81e4d8f 100644 --- a/docs/guides/authenticated-shell.md +++ b/docs/guides/authenticated-shell.md @@ -3,7 +3,7 @@ type: guide title: Authenticated Shell description: How a signed-in user experiences the post-login shell, including authenticated event streaming. tags: [guide, shell, header, sse, navigation, tester] -timestamp: 2026-07-22T09:03:53Z +timestamp: 2026-07-22T09:22:34Z --- # When this view is available @@ -35,11 +35,7 @@ before the shell mounts. # Event LED colors -The LED is rendered by `ShellHeaderComponent` as a `` -with one of four state classes attached via `[class.led-]`. The -visual styling lives in `frontend/src/styles.css` and is driven entirely -by the existing theme color tokens — there is no per-state color in -TypeScript. +The LED is rendered by `ShellHeaderComponent` as a `` with one of four state classes attached via `[class.led-]`. Its component-scoped styling is declared in `frontend/src/app/features/shell/header/shell-header.component.ts` and is driven entirely by the existing theme color tokens — there is no per-state color in TypeScript. | Event state | CSS class | Color token | Approx. hex | Visual | |-------------------|-----------------------|-----------------------|-------------|--------| @@ -81,8 +77,8 @@ error event. The shell retains the last event state until a later connection suc | `frontend/src/app/features/home/home.component.ts` | Hosts the shell and starts/stops the authenticated event stream. | | `frontend/src/app/core/services/authenticated-event-source.service.ts` | Fetch-based authenticated SSE transport with abort and frame parsing. | | `frontend/src/app/core/services/event-status.store.ts` | Applies event frames and derives the live countdown. | -| `frontend/src/app/features/shell/header/shell-header.component.ts` | Renders event LED, countdown, navigation, and user menu. | -| `frontend/src/styles.css` | Defines the `.led` base shape plus the four `.led-{state}` background-color rules keyed on theme tokens. | +| `frontend/src/app/features/shell/header/shell-header.component.ts` | Renders event LED, countdown, navigation, and user menu; owns the component-scoped LED shape and state color rules. | +| `frontend/src/styles.css` | Defines the shared theme color tokens consumed by the shell LED. | | `frontend/src/app/features/shell/tabs/quick-tabs.component.ts` | Renders the main navigation tabs. | | `tests/frontend/authenticated-event-source.spec.ts` | Verifies authorization headers, SSE frame delivery, and anonymous header omission. | diff --git a/docs/index.md b/docs/index.md index 28459fa..b689d13 100644 --- a/docs/index.md +++ b/docs/index.md @@ -11,7 +11,7 @@ scoreboard, an event window with a public countdown, theming, and admin controls. The docs below are organized by purpose so agents can pull just the slice -they need. Last regenerated 2026-07-22T09:03:53Z. +they need. Last regenerated 2026-07-22T09:22:34Z. # Architecture