@krigsvold/theme 2.0.0 → 2.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,60 @@
1
+ {
2
+ "schemaVersion": 1,
3
+ "primitives": [
4
+ "container",
5
+ "stack",
6
+ "cluster",
7
+ "grid",
8
+ "sidebar",
9
+ "split"
10
+ ],
11
+ "compositions": [
12
+ "article",
13
+ "landing",
14
+ "documentation"
15
+ ],
16
+ "defaults": {
17
+ "space": "regular",
18
+ "columns": 3,
19
+ "splitRatio": "equal",
20
+ "sidebarSide": "end"
21
+ },
22
+ "tokens": {
23
+ "layout-gap": "2rem",
24
+ "layout-gap-small": "1rem",
25
+ "layout-gap-large": "3rem",
26
+ "layout-sidebar-width": "20rem",
27
+ "layout-main-min": "30rem",
28
+ "layout-grid-min": "20rem",
29
+ "layout-split-min": "22rem",
30
+ "layout-section-space": "clamp(4.5rem, 8vw, 7.5rem)"
31
+ },
32
+ "sources": [
33
+ {
34
+ "url": "https://krigsvold.org/",
35
+ "repository": "basuhoward/krigsvold.org",
36
+ "commit": "a3cf072c516c59ed35814e0fa153028cc91ceecd",
37
+ "files": [
38
+ "src/layouts/Page.astro",
39
+ "src/components/HomeContent.astro",
40
+ "src/components/HomeHero.astro",
41
+ "src/styles/site.css"
42
+ ]
43
+ },
44
+ {
45
+ "url": "https://krigsvoldtheme.dev/",
46
+ "repository": "krigsvoldtheme/krigsvoldtheme",
47
+ "commit": "880bdd2bd8430bbdfd8d728faaae0c21199540b1",
48
+ "files": [
49
+ "site/src/pages/index.astro",
50
+ "site/src/styles/global.css",
51
+ "site/src/components/FoundationSpecimen.astro"
52
+ ]
53
+ }
54
+ ],
55
+ "normalization": {
56
+ "intrinsicSizing": "Columns and sidebars respond to their available container width, including nested containers, rather than only to viewport breakpoints.",
57
+ "readingOrder": "Sidebar side selects matching DOM order; split content retains its source order at all widths.",
58
+ "scope": "Namespaced optional layout classes; no global reset, framework dependency, image, personal identity, or scripts."
59
+ }
60
+ }
package/dist/legacy.css CHANGED
@@ -72,6 +72,14 @@
72
72
  --breakpoint-lg: var(--krigsvold-breakpoint-lg);
73
73
  --breakpoint-xl: var(--krigsvold-breakpoint-xl);
74
74
  --breakpoint-xxl: var(--krigsvold-breakpoint-xxl);
75
+ --layout-gap: var(--krigsvold-layout-gap);
76
+ --layout-gap-small: var(--krigsvold-layout-gap-small);
77
+ --layout-gap-large: var(--krigsvold-layout-gap-large);
78
+ --layout-sidebar-width: var(--krigsvold-layout-sidebar-width);
79
+ --layout-main-min: var(--krigsvold-layout-main-min);
80
+ --layout-grid-min: var(--krigsvold-layout-grid-min);
81
+ --layout-split-min: var(--krigsvold-layout-split-min);
82
+ --layout-section-space: var(--krigsvold-layout-section-space);
75
83
  --navy-950: var(--krigsvold-color-navy-950);
76
84
  --navy-900: var(--krigsvold-color-navy-900);
77
85
  --navy-800: var(--krigsvold-color-navy-800);
package/dist/light.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "2.0.0",
2
+ "version": "2.2.0",
3
3
  "id": "krigsvold-light",
4
4
  "name": "Krigsvold Light",
5
5
  "mode": "light",
@@ -0,0 +1,47 @@
1
+ /* Additive pattern anatomy. Existing classes and default layouts are unchanged. */
2
+ .krigsvold-reading-context { container:krigsvold-reading / inline-size; }
3
+ .krigsvold-reading-layout { display:grid; gap:2.5rem; align-items:start; }
4
+ .krigsvold-reading-layout > * { min-inline-size:0; max-inline-size:100%; }
5
+ .krigsvold-contents { min-inline-size:0; max-inline-size:100%; padding:1.2rem 1.4rem; font:1rem/1.5 var(--krigsvold-font-sans); color:var(--krigsvold-source-ink,var(--krigsvold-text)); background:var(--krigsvold-source-support,var(--krigsvold-panel)); overflow-wrap:anywhere; }
6
+ .krigsvold-contents__label { margin:0 0 .5rem; font-weight:700; }
7
+ .krigsvold-contents ul { list-style:none; padding:0; margin:0; }
8
+ .krigsvold-contents > ul > li { margin-block:.5rem 1rem; break-inside:avoid; }
9
+ .krigsvold-contents a { display:block; padding-block:.35rem; text-decoration:none; }
10
+ .krigsvold-contents a:hover { text-decoration:underline; }
11
+ .krigsvold-contents > ul > li > a { font-weight:700; }
12
+ .krigsvold-contents li ul { padding-inline-start:.85rem; }
13
+ .krigsvold-contents li li { margin-block:.25rem; }
14
+ .krigsvold-contents--inline > ul { columns:2 16rem; column-gap:2rem; }
15
+ @container krigsvold-reading (min-width:74rem) {
16
+ .krigsvold-reading-layout { grid-template-columns:20rem minmax(0,760px); gap:clamp(2rem,4cqi,5rem); justify-content:center; }
17
+ .krigsvold-reading-layout__contents { position:sticky; top:6rem; max-block-size:calc(100vh - 7rem); overflow:auto; }
18
+ .krigsvold-reading-layout .krigsvold-contents--index { background:transparent; padding:1.25rem 0 0; }
19
+ }
20
+ @media (orientation:portrait) { .krigsvold-reading-layout { grid-template-columns:minmax(0,1fr); } .krigsvold-reading-layout__contents { position:static; max-block-size:none; overflow:visible; } }
21
+ .krigsvold-site-footer--grouped { background:var(--krigsvold-color-navy-950); color:rgba(255,255,255,.72); font:1rem/1.65 var(--krigsvold-font-sans); border:0; padding-block:5rem 1.5rem; }
22
+ .krigsvold-site-footer--grouped a { color:inherit; text-decoration:none; padding-block:0; }
23
+ .krigsvold-site-footer--grouped a:hover { color:white; text-decoration:underline; }
24
+ .krigsvold-site-footer__groups { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:3rem; }
25
+ .krigsvold-site-footer__groups > *, .krigsvold-site-footer__identity, .krigsvold-site-footer__base > * { min-inline-size:0; }
26
+ .krigsvold-site-footer__group h2 { font-family:var(--krigsvold-font-sans); color:white; margin:0 0 1rem; font-size:.76rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
27
+ .krigsvold-site-footer__group ul { list-style:none; padding:0; margin:0; }
28
+ .krigsvold-site-footer__group li { margin-block:.45rem; }
29
+ .krigsvold-site-footer__base { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem 2rem; margin-block-start:2.5rem; padding-block-start:1.5rem; border-block-start:1px solid rgba(255,255,255,.16); font-size:.82rem; }
30
+ .krigsvold-site-footer__identity :where(img,svg) { max-inline-size:100%; block-size:auto; }
31
+ .krigsvold-site-footer--grouped :where(:focus-visible) { outline:3px solid white; outline-offset:3px; }
32
+ .krigsvold-site-footer__top { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:3rem; }
33
+ .krigsvold-site-footer__identity { grid-column:span 2; }
34
+ .krigsvold-site-footer__groups { grid-column:span 4; }
35
+ .krigsvold-site-footer__group a { font-size:.88rem; font-weight:500; }
36
+ .krigsvold-site-footer--grouped > .krigsvold-container { inline-size:100%; padding-inline:12px; }
37
+ @media(min-width:576px) { .krigsvold-site-footer--grouped > .krigsvold-container { max-inline-size:540px; } }
38
+ @media(min-width:768px) { .krigsvold-site-footer--grouped > .krigsvold-container { max-inline-size:720px; } }
39
+ @media(min-width:992px) { .krigsvold-site-footer--grouped > .krigsvold-container { max-inline-size:960px; } }
40
+ @media(min-width:1200px) { .krigsvold-site-footer--grouped > .krigsvold-container { max-inline-size:1140px; } }
41
+ @media(min-width:1400px) { .krigsvold-site-footer--grouped > .krigsvold-container { max-inline-size:1320px; } }
42
+ @media(max-width:991.98px) { .krigsvold-site-footer__top { display:block; } .krigsvold-site-footer__identity { margin-block-end:2.5rem; } }
43
+ @media(max-width:767.98px) { .krigsvold-site-footer__groups { grid-template-columns:repeat(2,minmax(0,1fr)); gap:2rem; } }
44
+ @media(max-width:359px) { .krigsvold-site-footer__groups { grid-template-columns:minmax(0,1fr); } }
45
+ @media print { .krigsvold-reading-layout { display:block; } .krigsvold-reading-layout__contents { position:static; max-block-size:none; overflow:visible; margin-block-end:2rem; } }
46
+
47
+ .krigsvold-site-footer__top:not(:has(.krigsvold-site-footer__identity)) .krigsvold-site-footer__groups { grid-column:1 / -1; }
@@ -0,0 +1,23 @@
1
+ /* Opt-in source translation. Existing semantic palettes and default primitives are unchanged. */
2
+ .krigsvold-source-profile {
3
+ --krigsvold-field-gap:.5rem; --krigsvold-group-gap:1.5rem; --krigsvold-region-gap:3rem;
4
+ color:var(--krigsvold-source-ink,var(--krigsvold-text));
5
+ }
6
+ [data-krigsvold="light"] {
7
+ --krigsvold-source-ink:var(--krigsvold-color-ink);
8
+ --krigsvold-source-heading:var(--krigsvold-color-navy-900);
9
+ --krigsvold-source-support:var(--krigsvold-color-ice-100);
10
+ --krigsvold-source-label:var(--krigsvold-color-blue-600);
11
+ --krigsvold-source-button-bg:var(--krigsvold-color-navy-950); --krigsvold-source-button-hover:var(--krigsvold-color-blue-600); --krigsvold-source-button-text:white;
12
+ }
13
+ .krigsvold-source-profile .krigsvold-prose { font-size:var(--krigsvold-text-body); line-height:var(--krigsvold-leading-body); }
14
+ .krigsvold-source-profile :where(h1,h2,h3) { color:var(--krigsvold-source-heading,var(--krigsvold-text-strong)); }
15
+ .krigsvold-source-profile .krigsvold-page-header__copy::after { display:none; }
16
+ .krigsvold-source-profile { font-size:1rem; }
17
+ .krigsvold-source-profile .krigsvold-button:not(:disabled) { background:var(--krigsvold-source-button-bg,var(--krigsvold-accent)); border-color:var(--krigsvold-source-button-bg,var(--krigsvold-accent)); color:var(--krigsvold-source-button-text,var(--krigsvold-on-accent)); }
18
+ .krigsvold-source-profile .krigsvold-button:not(:disabled):hover { background:var(--krigsvold-source-button-hover,var(--krigsvold-accent-hover)); }
19
+ .krigsvold-source-profile .krigsvold-prose :where(blockquote) { border-inline-start:4px solid var(--krigsvold-color-blue-600); padding-inline-start:1.2rem; font-family:var(--krigsvold-font-serif); }
20
+
21
+ [data-krigsvold="dark"] { --krigsvold-source-ink:var(--krigsvold-text); --krigsvold-source-heading:var(--krigsvold-text-strong); --krigsvold-source-support:var(--krigsvold-panel); --krigsvold-source-label:var(--krigsvold-accent); --krigsvold-source-button-bg:var(--krigsvold-accent); --krigsvold-source-button-hover:var(--krigsvold-accent-hover); --krigsvold-source-button-text:var(--krigsvold-on-accent); }
22
+
23
+ .krigsvold-source-profile .krigsvold-page-header { background:transparent; color:var(--krigsvold-source-ink,var(--krigsvold-text)); }
package/dist/tokens.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "Krigsvold",
3
- "version": "2.0.0",
3
+ "version": "2.2.0",
4
4
  "heritage": {
5
5
  "navy950": "#061325",
6
6
  "navy900": "#0A1D35",
@@ -146,7 +146,15 @@
146
146
  "breakpoint-md": "768px",
147
147
  "breakpoint-lg": "992px",
148
148
  "breakpoint-xl": "1200px",
149
- "breakpoint-xxl": "1400px"
149
+ "breakpoint-xxl": "1400px",
150
+ "layout-gap": "2rem",
151
+ "layout-gap-small": "1rem",
152
+ "layout-gap-large": "3rem",
153
+ "layout-sidebar-width": "20rem",
154
+ "layout-main-min": "30rem",
155
+ "layout-grid-min": "20rem",
156
+ "layout-split-min": "22rem",
157
+ "layout-section-space": "clamp(4.5rem, 8vw, 7.5rem)"
150
158
  },
151
159
  "typographyRoles": {
152
160
  "serif": {
@@ -210,7 +218,8 @@
210
218
  "spacing",
211
219
  "shape",
212
220
  "depth",
213
- "interaction variables"
221
+ "interaction variables",
222
+ "layout primitives"
214
223
  ],
215
224
  "optional": [
216
225
  "font loading",
@@ -225,7 +234,13 @@
225
234
  "container",
226
235
  "section heading",
227
236
  "card",
228
- "button"
237
+ "button",
238
+ "page header",
239
+ "site header",
240
+ "site footer",
241
+ "article layout",
242
+ "landing layout",
243
+ "documentation layout"
229
244
  ],
230
245
  "hostOwned": [
231
246
  "navigation",
@@ -296,6 +311,66 @@
296
311
  ]
297
312
  }
298
313
  },
314
+ "layout": {
315
+ "schemaVersion": 1,
316
+ "primitives": [
317
+ "container",
318
+ "stack",
319
+ "cluster",
320
+ "grid",
321
+ "sidebar",
322
+ "split"
323
+ ],
324
+ "compositions": [
325
+ "article",
326
+ "landing",
327
+ "documentation"
328
+ ],
329
+ "defaults": {
330
+ "space": "regular",
331
+ "columns": 3,
332
+ "splitRatio": "equal",
333
+ "sidebarSide": "end"
334
+ },
335
+ "tokens": {
336
+ "layout-gap": "2rem",
337
+ "layout-gap-small": "1rem",
338
+ "layout-gap-large": "3rem",
339
+ "layout-sidebar-width": "20rem",
340
+ "layout-main-min": "30rem",
341
+ "layout-grid-min": "20rem",
342
+ "layout-split-min": "22rem",
343
+ "layout-section-space": "clamp(4.5rem, 8vw, 7.5rem)"
344
+ },
345
+ "sources": [
346
+ {
347
+ "url": "https://krigsvold.org/",
348
+ "repository": "basuhoward/krigsvold.org",
349
+ "commit": "a3cf072c516c59ed35814e0fa153028cc91ceecd",
350
+ "files": [
351
+ "src/layouts/Page.astro",
352
+ "src/components/HomeContent.astro",
353
+ "src/components/HomeHero.astro",
354
+ "src/styles/site.css"
355
+ ]
356
+ },
357
+ {
358
+ "url": "https://krigsvoldtheme.dev/",
359
+ "repository": "krigsvoldtheme/krigsvoldtheme",
360
+ "commit": "880bdd2bd8430bbdfd8d728faaae0c21199540b1",
361
+ "files": [
362
+ "site/src/pages/index.astro",
363
+ "site/src/styles/global.css",
364
+ "site/src/components/FoundationSpecimen.astro"
365
+ ]
366
+ }
367
+ ],
368
+ "normalization": {
369
+ "intrinsicSizing": "Columns and sidebars respond to their available container width, including nested containers, rather than only to viewport breakpoints.",
370
+ "readingOrder": "Sidebar side selects matching DOM order; split content retains its source order at all widths.",
371
+ "scope": "Namespaced optional layout classes; no global reset, framework dependency, image, personal identity, or scripts."
372
+ }
373
+ },
299
374
  "themes": {
300
375
  "light": {
301
376
  "id": "krigsvold-light",
@@ -0,0 +1,57 @@
1
+ # Krigsvold design charter
2
+
3
+ Version 1.0 · Adopted October 21, 2026
4
+
5
+ This charter establishes the direction for Krigsvold's development as a complete design system. Its starting observation is agreed: Krigsvold feels icy. The meaning of that character is still developing; the principles below make it specific enough to explore and evaluate. Existing package contracts remain in force; this document introduces no token, API, or compatibility changes and does not imply that the proposed component inventory has shipped.
6
+
7
+ ## Purpose and character
8
+
9
+ Krigsvold should give digital experiences a sense of clarity, stillness, precision, and space. Its icy character should emerge through crisp typography, deliberate boundaries, aligned regions, and controlled contrast. People should be able to understand the structure of an unfamiliar page and find the information or action they need.
10
+
11
+ The existing navy, glacier blue, paper surfaces, bronze accents, and Roboto family provide a starting vocabulary. Roboto supports body and interface text; Roboto Slab gives headings a strong presence; Roboto Mono supports code and numerical work. Literal imagery of ice is optional. The character should remain apparent in an ordinary form or table and in both Light and Dark modes.
12
+
13
+ Krigsvold's originating sites offer useful evidence, but the system should support publishing, services, collections, and interactive applications. A reading experience deserves as much care as a working panel. Adopting projects supply their own identity, content, and organizational purpose.
14
+
15
+ ## Design principles
16
+
17
+ **Make structure legible.** Establish clear regions for orientation, content, supporting information, and action. Use alignment, typographic hierarchy, boundaries, and contrasting surfaces to explain those regions. A boundary should communicate a meaningful change in purpose, state, or context.
18
+
19
+ **Give space a defined role.** Separate major regions generously when their purposes differ. Within a working region, spacing should group related information and support efficient comparison. A compact table and an expansive page can belong to the same system. Density must be an explicit choice with readable text and usable controls.
20
+
21
+ **Use contrast to clarify importance.** Navy, glacier tones, light surfaces, and bronze should establish an understandable hierarchy. Assign color through semantic roles, including status and interaction states. Color is one source of information; labels, shape, position, and other cues must preserve meaning when color distinctions are unavailable.
22
+
23
+ **Treat precision as assistance.** Labels should identify what information is required. Status should distinguish what has happened, what is happening, and what someone can do next. Errors should explain a useful recovery path and retain entered work where possible. Icy clarity must remain approachable when a person is uncertain or a task fails.
24
+
25
+ **Keep change controlled.** Transitions should establish a new state or location without competing with the task. Use restrained motion and provide understandable updates when motion is reduced or absent. Stable alignment and persistent context matter during loading, filtering, expansion, and navigation.
26
+
27
+ ## Foundations and component contracts
28
+
29
+ The specification should cover semantic color, typography, spacing, reading and content widths, responsive composition, density, borders, shape, elevation, layering, and motion. Define the relationships among page regions and the local spacing inside them. Reference scales, semantic tokens, and component dimensions need separate explanations. Numerical values and public names belong in versioned specifications; the charter supplies criteria for their development.
30
+
31
+ Expand the component inventory through forms, navigation, feedback, disclosure, overlays, data presentation, and complete task patterns. Each supported component needs a purpose, anatomy, applicable states, interaction rules, content guidance, responsive behavior, and accessibility acceptance criteria. Demonstrate combinations such as a filtered collection or a validated form. Distinguish planned, experimental, and stable capabilities.
32
+
33
+ Accessibility is a condition of acceptance. Review keyboard operation, focus visibility and restoration, labels and announcements, contrast, text enlargement, reflow, forced colors, and reduced motion where applicable. Support long content, localization, and changes in reading direction. Document what works without JavaScript and which interactions require it. Preserve source order and access to information as layouts change.
34
+
35
+ ## Relationship with Martlet
36
+
37
+ Krigsvold and Martlet share blue, white, gold, order, and restraint. Their different emotional temperatures emerged through their development. Krigsvold's charter should describe its own character; each design decision does not need an opposing Martlet decision. Sound usability and accessibility can produce identical answers in both families.
38
+
39
+ Share interaction contracts, accessibility work, tests, and tooling where practical. Keep independent judgments about typography, spatial organization, surfaces, and visual emphasis. Krigsvold's icy character needs to be recognizable beyond its palette or a distinctive hero. Neither family is restricted to institutional or editorial work.
40
+
41
+ ## Living baselines
42
+
43
+ [krigsvold.org](https://krigsvold.org/) is the starting ground truth for Krigsvold and remains a live baseline throughout the system's development. Its real content, tasks, and ongoing use provide evidence for design decisions. The baseline describes what works today and can evolve as generalization exposes better solutions.
44
+
45
+ An inherited decision that fails when generalized should be removed or revised. Establish a working replacement against both the originating site's real usage and the broader conditions that exposed the failure. Historical fidelity does not justify retaining a design that no longer works.
46
+
47
+ Carry the validated improvement into the packages and specifications, then back into the originating website. Verify the revised site in use so it becomes the next live baseline. Record the failure, the replacement, and the reasons for the change, and follow the release and migration requirements of affected contracts.
48
+
49
+ This feedback loop continues throughout development: observe real use, generalize, test, replace what fails, and improve the baseline. Controlled examples and automated checks support that work; they cannot establish real-world fitness on their own.
50
+
51
+ ## Evidence and review
52
+
53
+ The next milestone is four comparative experiences: an article with supporting material, a substantial form, a searchable collection, and an application dashboard. Ground these comparisons in real content and tasks, and give both families the same content and functionality. Continue evaluating changes against the live baseline while exploring contexts beyond it. With brand marks removed, review whether Krigsvold's structure, rhythm, and emphasis still convey its character. Check that generous regional spacing and any compact local density remain useful at narrow widths and with enlarged text.
54
+
55
+ The live sites should exercise the system as consumers. Move reusable decisions into the packages and specifications while keeping site identity, navigation, routing, content, analytics, and consent policy with the host. Examples embedded in a site should use its shared page shell. Standalone starters should make their purpose clear.
56
+
57
+ Maintainers should document the reasons for consequential changes and identify provisional decisions. Review proposals against the charter, demonstrated user needs, and compatibility obligations. Version and deprecate stable contracts deliberately. The charter can change as practical use gives greater precision to the meaning of icy clarity.
@@ -0,0 +1,29 @@
1
+ # Krigsvold consolidation
2
+
3
+ Core 2.2.0 and Astro 1.2.0 are **experimental release candidates**. Existing theme colors, typography defaults, component defaults, and Astro slots are retained. Do not install an unpublished version from npm. Use the paired review branches or packed archives to evaluate this change.
4
+
5
+ The core owns [grammar](grammar.md), [source decisions](source-decisions.md), [foundation requirements](foundations.md), `language.json`, and framework-independent pattern CSS. Astro owns rendering and slots. React owns its events, controlled state and focus APIs. Documentation and agent references must identify the exact guidance revision. Publication does not establish grammar stability.
6
+
7
+ ## Opt into source roles
8
+
9
+ Import `@krigsvold/theme/source-profile.css` after the regular core styles. Apply `krigsvold-source-profile` to an existing `.krigsvold` container (or pass it through Astro `bodyClass`) within `data-krigsvold="light"` or `"dark"`. This restores audited reading roles and removes the unsupported page-header accent in that scope. New field/group/region relationships remain experimental. Nested opposite appearances must start their own source-profile scope.
10
+
11
+ `full.css` includes additive `patterns.css`; color-only imports still load no pattern styling. Existing palette JSON is unchanged apart from version metadata. No personal identity, analytics, legal policy, imagery, automatic global stripe, or navigation orientation is imposed.
12
+
13
+ ## Content and footer anatomy
14
+
15
+ Use TableOfContents with `items` containing `href`, `label`, and optional `depth: 2 | 3`; the default depth is 2. A depth-3 item requires a preceding depth-2 parent. Native nested lists retain parent/child semantics. `variant="index"` belongs in ArticleLayout's `contents` slot. `variant="inline"` is an in-body alternative. Localize `label` explicitly.
16
+
17
+ ArticleLayout retains its existing `sidebar` slot and end-side supporting region. Its new `contents` slot precedes the body; supporting material still follows the body. DocumentationLayout's existing `navigation` slot is unchanged. A TOC does not make every page require a left rail.
18
+
19
+ SiteFooter defaults to the existing plain rendering. `variant="grouped"` accepts `groups: {label, links: {href, label}[]}[]`, plus `identity` and `base` slots. Existing `links`, `navigationLabel`, class and default slot remain supported in either variant. The host supplies its own mark, ownership, contact, translated group names and destinations. Krigsvold uses a wide identity column plus four groups and an independent base row; fewer or more groups wrap within that region.
20
+
21
+ ## Navigation and interaction boundaries
22
+
23
+ Both languages permit top, side and focused frames. Astro SiteHeader remains a wrapping link header; no dropdown, menu controller or React state API is claimed. The source desktop dropdown is white even on a dark parent; below 992px it becomes transparent and in-flow. This is guidance for a host-owned menu, not a new Astro dropdown component.
24
+
25
+ Preserve native semantics, focus visibility, retained input, actionable validation, save retry, draft protection and undo where appropriate. These behavioral obligations cross frameworks; their React implementations do not become Astro props. Full dark mode and new app controls remain extensions. Figure, footnote, maths, archive/card variants and richer data workflows remain gaps.
26
+
27
+ ## Experimental distribution
28
+
29
+ The GitHub pre-release publishes the verified package under npm’s `next` dist-tag. The existing `latest` tag stays unchanged. An experimental publication does not establish grammar stability or manual assistive-technology conformance. Promote a release only through a separate reviewed release decision.
@@ -0,0 +1,40 @@
1
+ # Krigsvold grammar coverage review
2
+
3
+ Review 0.3 · October 24, 2026 · Experimental
4
+
5
+ The baseline grammar described intent and an experimental collection/editor. This review adds decision rules for grouping, density, action scope, layers, validated forms and queried results. Existing origin objects remain authoritative. New application patterns are justified extensions and are not retrospectively attributed to the origin site.
6
+
7
+ | ID | Domain | Disposition | Rule or remaining work | Evidence surface |
8
+ | --- | --- | --- | --- | --- |
9
+ | G01 | Source authority | Documented | Origin objects, translations and extensions remain distinct. | Source audit and source-decisions.md |
10
+ | G02 | Field / group / region spacing | Rule clarified + reference | Use relational roles; do not inherit page-section spacing inside forms. | Validated-form reference |
11
+ | G03 | Density and targets | Claim corrected; compact open | Comfortable examples only; 44px is a design target, not blanket certification. | Foundations; target-size checks |
12
+ | G04 | Typography and hierarchy | Observed roles retained | Keep prose, UI, selective display and code roles; no decorative monospace. | Source decisions; existing React/Astro checks |
13
+ | G05 | Surfaces and layers | Rule corrected + reference | Modal, popup and inline disclosure have different interaction contracts. | Native dialog in form/results |
14
+ | G06 | Action placement and scope | Rule clarified + reference | Commands name and follow their field, object or collection scope. | Validated-form and results references |
15
+ | G07 | Responsive composition | Reference checks | Reflow fields/actions; scroll only genuine comparison surfaces; retain source order. | Narrow/enlarged-text browser checks |
16
+ | G08 | Substantial forms | New experimental contract | Validate, retain values, retry and guard specimen reset. | docs/patterns/forms.md |
17
+ | G09 | Query / sort / page | New experimental contract | Draft query differs from applied results; changed query starts page 1. | docs/patterns/query-results.md |
18
+ | G10 | Selection | New bounded contract | Binary current-page selection; scope changes reset on commit, failure retains it. | Results reference; no mixed/select-all API |
19
+ | G11 | Pending / failed / empty states | Reference coverage expanded | Keep useful previous content and distinguish no matches from empty source data. | Form/results/collection specimens |
20
+ | G12 | Focus and recovery | Reference checks; manual open | Summary links, modal dismissal, return trigger and late-response cancellation. | Browser assertions; manual AT still open |
21
+ | G13 | Top / side / focused frames | Existing support retained | Frame follows task; source navigation direction is not a family restriction. | AppShell and existing browser checks |
22
+ | G14 | Reading / contents / footer | Existing source contracts retained | Contents, body, support and host identity remain separate. | Astro candidate and source audit |
23
+ | G15 | Cross-framework agreement | Availability clarified | Rules cross frameworks; React state/focus props do not become Astro APIs. | language.json; native-HTML guidance |
24
+ | G16 | Figure / footnote / maths / archive vocabulary | Open | Do not infer shipped components from origin CSS. | Source decisions; no new API claim |
25
+ | G17 | Localization / RTL / assistive technology | Open | Long-text checks are partial evidence; no manual or locale certification. | Consumer and manual review required |
26
+ | G18 | Sustained use / dashboard breadth | Open | Focused references do not establish production fitness or cover all application patterns. | Future consumer evidence |
27
+
28
+ ## Acceptance and limits
29
+
30
+ Each pattern contract names its purpose, anatomy, scope, states, keyboard/focus behavior, responsive behavior and implementation availability. Automated results are recorded separately from documented requirements. A rule is not stable merely because a specimen passes. New form and results specimens use deterministic session state and simulated latency/failure. They do not add a new application or change the collection/editor into a production service.
31
+
32
+ The foundations no longer claim that every React target is 44 pixels, no longer require a backdrop for all overlays, and now acknowledge the optional core source-profile aliases. Modal focus behavior, native read-only/disabled distinctions, selection scope and draft-versus-applied query are explicit. Compatibility remains additive; existing package defaults and APIs are retained.
33
+
34
+ ## Framework boundaries
35
+
36
+ Core owns grammar, semantic roles and source profiles. React supplies interactive specimens using existing exports. Astro retains its documented component inventory and can use the same native HTML semantics; host scripts own form/query controllers. The main reference and agent snapshots identify this exact canonical revision. No framework receives an implementation claim from shared prose alone.
37
+
38
+ ## Reference method
39
+
40
+ The source audit, adopted charter and actual exported APIs govern these decisions. Carbon's [form](https://www.carbondesignsystem.com/building-blocks/core/patterns/forms), [loading](https://www.carbondesignsystem.com/building-blocks/core/patterns/loading) and [filtering](https://www.carbondesignsystem.com/building-blocks/core/patterns/filtering) guidance informed the breadth of questions, not either language's palette or composition. Our search controls retain visible labels under our own grammar. Target sizing follows the distinctions in [W3C SC 2.5.8](https://www.w3.org/WAI/WCAG22/Understanding/target-size-minimum.html), without treating automated checks as overall WCAG certification.
@@ -0,0 +1,108 @@
1
+ # Krigsvold foundations specification
2
+
3
+ Version 0.1 · Working specification · October 21, 2026
4
+
5
+ The [adopted charter](charter.md) governs this specification. The values below describe the shipped `@krigsvold/theme` 2.1.0 foundation and layout contracts. Normative requirements describe what new components must satisfy; they do not certify existing components. Application-specific experiments must remain identifiable until real usage validates them.
6
+
7
+ ## Character and hierarchy
8
+
9
+ Krigsvold makes substantial work feel clear and composed. Roboto supports continuous interface work; Roboto Slab establishes strong headings. Use aligned regions, precise rules, explicit metadata, restrained ice surfaces, and space between tasks. Precision must never become terse or hostile error copy.
10
+
11
+ A page identifies its purpose, then its primary task, then supporting information. Use one main landmark and a descriptive h1. Related controls form a group with a visible heading or legend. Put explanations close to the decisions they explain. Do not communicate hierarchy, selection, validation, or maturity through color alone.
12
+
13
+ ## Shipped measurements
14
+
15
+ All CSS properties carry the `--krigsvold-` prefix. Numbers in spacing token names are family-local identifiers, not interchangeable units. In particular, `space-3` differs between Martlet and Krigsvold. Cross-family components use semantic relationships and family adapters rather than copying numeric token names.
16
+
17
+ | Token | Shipped value |
18
+ | --- | --- |
19
+ | `space-1` | `.25rem` |
20
+ | `space-2` | `.5rem` |
21
+ | `space-3` | `.75rem` |
22
+ | `space-4` | `1rem` |
23
+ | `space-6` | `1.5rem` |
24
+ | `space-8` | `2rem` |
25
+ | `space-12` | `3rem` |
26
+ | `space-16` | `4rem` |
27
+ | `space-24` | `6rem` |
28
+ | `reading-width` | `760px` |
29
+ | `content-width` | `1320px` |
30
+ | `archive-width` | `1320px` |
31
+ | `radius-control` | `.15rem` |
32
+ | `radius-card` | `0` |
33
+ | `motion-duration` | `.15s` |
34
+ | `text-body` | `1.06rem` |
35
+ | `text-h1` | `clamp(2.8rem, 6vw, 5.5rem)` |
36
+ | `text-h2` | `2.1rem` |
37
+ | `text-h3` | `1.42rem` |
38
+ | `text-display` | `clamp(3.4rem, 7vw, 6.8rem)` |
39
+ | `text-section` | `clamp(2rem, 4vw, 3.5rem)` |
40
+ | `leading-body` | `1.65` |
41
+ | `leading-heading` | `1.13` |
42
+ | `leading-display` | `.98` |
43
+ | `focus-width` | `3px` |
44
+ | `focus-gap` | `3px` |
45
+ | `gutter` | `.75rem` |
46
+ | `control-height` | `2.75rem` |
47
+ | `control-padding` | `.9rem` |
48
+ | `button-padding` | `.625rem 1.5rem` |
49
+ | `text-button` | `.75rem` |
50
+ | `leading-button` | `1.667` |
51
+ | `layout-gap` | `2rem` |
52
+ | `layout-gap-small` | `1rem` |
53
+ | `layout-gap-large` | `3rem` |
54
+ | `layout-sidebar-width` | `20rem` |
55
+ | `layout-main-min` | `30rem` |
56
+ | `layout-grid-min` | `20rem` |
57
+ | `layout-split-min` | `22rem` |
58
+ | `layout-section-space` | `clamp(4.5rem, 8vw, 7.5rem)` |
59
+
60
+ The complete [foundation JSON](../dist/foundation.json) and [layout contract](../dist/layout.json) remain the machine-readable sources for shipped values. Typography roles are Cambo/Lato/Cinzel/IBM Plex Mono for Martlet and Roboto/Roboto Slab/Roboto Mono for Krigsvold. A missing font must leave the page readable using the supplied fallback stacks. Font loading must not hide controls or critical instructions.
61
+
62
+ ## Spacing relationships
63
+
64
+ Use small layout spacing inside a related group, regular spacing between sibling groups, and large spacing between distinct tasks. Public reading pages use the shipped section spacing; an application does not inherit a public hero's vertical padding merely because it has a title. Margins on content must not double the parent's layout gap. A nested layout establishes its own spacing context.
65
+
66
+ The initial React workbench proposes `field-gap`, `group-gap`, `region-gap`, `page-gutter`, and `row-padding` as application roles. The 2.2.0 candidate also exposes the field/group/region aliases in an opt-in source profile. These assignments remain experimental and do not alter the stable reference scale. Measure the distinction between fields, groups, and regions during real registry work before promoting them. Never compress an interface simply to fit more rows.
67
+
68
+ ## Responsive composition
69
+
70
+ Containers are bounded by reading, content, or archive measure. Layout primitives wrap according to their content minima: grids use their minimum cell size; sidebar and split regions wrap without changing source order. The smallest viewport must have one coherent reading and focus order. Breakpoints are consequences of content, not device names.
71
+
72
+ At 320 CSS pixels and at 400% zoom on a 1280-pixel viewport, navigation wraps, forms become one column, and action groups wrap. Long identifiers and translated copy cannot force page-wide overflow. A genuinely two-dimensional table may scroll inside a labelled, keyboard-focusable region. Keep captions, selection controls, and row actions discoverable. Do not remove columns solely to conceal overflow.
73
+
74
+ ## Type and density
75
+
76
+ Use the documented font roles and unitless line heights. Application fields, tables, and navigation use the sans family. Preserve a clear heading-to-body hierarchy without applying public hero sizes to an editor panel. Text must remain usable at 200% resizing and with user text-spacing overrides. Labels remain visible when a field contains a value.
77
+
78
+ This specification recognizes comfortable density only. Compact density is proposed and requires a real high-volume task before adoption. New standalone actions should target 44 by 44 CSS pixels where practical. This is a design target, not a measured claim about every existing link or control. Assess WCAG 2.2 target sizing at 24 by 24 CSS pixels or a documented exception; inspect adjacent target spacing and inline/native exceptions in the actual composition. A denser row changes padding and hierarchy, never silently shrinks interaction targets or body text. Existing smaller legacy controls need review rather than retrospective certification.
79
+
80
+ ## Surfaces and layering
81
+
82
+ Use semantic canvas, subtle, sunken, and overlay colors from the theme. Flat surfaces and rules establish most structure. Shadow tokens exist but do not justify elevating every section. Modal dialog content needs an accessible name, a clear dismissal path and modal background treatment. Non-modal popups and disclosures retain their own interaction contracts; they do not automatically require a backdrop or focus trap.
83
+
84
+ Proposed application layers are base 0, sticky context 10, and transient non-modal feedback 20. Native modal dialogs use the browser top layer and must not depend on a fabricated large z-index. Sticky regions may not obscure focused controls or error summaries. Avoid sticky layout on small screens unless it remains usable at zoom.
85
+
86
+ ## Motion
87
+
88
+ Use the shipped duration and easing for brief state changes. Motion communicates a change; it must not delay submitting, saving, navigating, or reading feedback. With `prefers-reduced-motion: reduce`, remove nonessential transitions, smooth scrolling, and decorative animation. Never require animation to understand a saved or failed state. Loading and saving states include text and remain announced without repeated alerts.
89
+
90
+ ## Accessibility and interaction contracts
91
+
92
+ Target WCAG 2.2 AA. Verify normal text contrast of 4.5:1, large text 3:1, and essential control boundaries and focus indicators 3:1 against adjacent colors. Measure actual combinations in both light and dark modes. Tokens alone cannot certify a composition. Retain a visible focus ring, logical keyboard order, a skip link, native form semantics, and meaningful names.
93
+
94
+ Validation associates field errors with controls, marks invalid controls, and offers an error summary that can receive focus. Keep entered values after failure. Announce successful saves with a polite status; use an alert for blocking failures. A modal traps focus through native dialog behavior, supports Escape, and returns focus to its trigger. Disabled and read-only are distinct states. Loading, empty, no-match, invalid, unavailable, saving, saved, failed, conflict, and unsaved-navigation states must be explicitly designed.
95
+
96
+ ## Evidence and change control
97
+
98
+ The live baseline is https://krigsvold.org/. It supplies evidence for publishing and public navigation. The [design workbench](https://github.com/howardjp/design-workbench) supplies an experimental administration consumer. Its existence is not proof of sustained use or complete accessibility. Record the task, observed failure, proposed change, tests, and result in real use. Replace an inherited decision when generalization fails, then update the original site and verify the result there.
99
+
100
+ Before a foundation becomes stable, document its consumers, browser and assistive-technology coverage, responsive and contrast checks, migration impact, and acceptance criteria. Review same-content article, substantial form, searchable collection, and dashboard experiences across both families. Promote aliases only after evidence; version public changes and publish migrations. The current React packages and workbench remain experimental. The construction plan and registry contract describe the remaining work.
101
+
102
+ ## Source reconciliation and consolidation
103
+
104
+ The October 23 source audit refines this working specification. Use [source decisions](source-decisions.md) for observed objects, [grammar](grammar.md) for experimental application relationships, and [consolidation](consolidation.md) for opt-in profiles and framework support. The shipped 2.1.0 measurements above are historical baseline values, not proof that all defaults match the observed source cascade. The 2.2.0 candidate adds opt-in relationship aliases without promoting them to stable foundation requirements.
105
+
106
+ ## Coverage review 0.3
107
+
108
+ The [coverage ledger](coverage.md) records the reviewed domains, corrections, focused form/results contracts and remaining evidence. The new references supply controlled state coverage, not sustained production use. Target-sizing interpretation follows [W3C SC 2.5.8](https://www.w3.org/WAI/WCAG22/Understanding/target-size-minimum.html).
@@ -0,0 +1,75 @@
1
+ # Krigsvold: a grammar of clear regions
2
+
3
+ Experimental grammar 0.3 · Core 2.2.0 candidate · Astro 1.2.0 candidate · React 0.1.0
4
+
5
+ Krigsvold makes complex work legible through purposeful regions, stable alignment, controlled contrast, and precise state. Its clarity must remain approachable when a person is uncertain or an operation fails. Its adopted charter supplies the criteria for these experimental application rules.
6
+
7
+ ## Source authority and current decisions
8
+
9
+ Existing origin objects are the baseline. Read the `decisions` MCP reference or the source-decision profile before choosing visual rules. Distinguish observed source roles, a contextual translation, and a new application extension. Do not add a global gold stripe, decorative monospace labels, arbitrary accent rules, or mechanically opposite family layouts. Keep new capabilities only with a stated task purpose. The October 23 audit is a fixed record; the reconciliation ledger records implemented decisions and remaining gaps. This remains an experimental grammar, not a declaration of stability.
10
+
11
+ ## Assign each region a job
12
+
13
+ Identify orientation, scope, work, supporting information, and commands. Align related information so that a person can compare it without reconstructing the layout. Use a boundary when purpose or context changes; use local proximity inside a working region. A border around every field does not explain the larger structure, and a large empty gap does not automatically make it clear.
14
+
15
+ The optional source profile exposes `--krigsvold-field-gap`, `--krigsvold-group-gap`, and `--krigsvold-region-gap`. This pattern maps local grouping to the existing 0.5rem scale step, groups to 1.5rem, and distinct regions to the existing 3rem scale step. These experimental application roles explain relationships rather than replacing the foundation's reference scale. Regional space and compact local rows can coexist. Density is a region-level decision; keep readable text, visible focus, and usable targets.
16
+
17
+ ## Make hierarchy exact
18
+
19
+ Use Roboto for interface and body text, Roboto Slab for heading roles, and Roboto Mono where code or numerical comparison benefits. Establish common edges for related labels, values, and actions. Keep the existing navy, glacier, paper, and bronze vocabulary assigned through semantic roles. Contrast should identify importance and interaction state, not merely alternate decorative sections.
20
+
21
+ Keep the desktop navigation popup white with ink text and source pointer/elevation, even inside a dark header. Below 992px its source mobile submenu becomes transparent and in-flow. Use other surface changes only to distinguish purpose or depth. A selected result needs a visible non-color cue as well as contrast. Metadata must remain subordinate without becoming illegible. Truncation is appropriate only when the complete information remains available at a predictable destination.
22
+
23
+ ## Make scope visible
24
+
25
+ Keep commands near the region they affect. Distinguish collection operations from object operations and persistent state from draft state. Show the current scope beside filtering and search. A result-row activation opens its record; a separate Edit action starts modification. Selection does not silently imply a destructive command or an edit.
26
+
27
+ Use explicit labels for what is pending, completed, unavailable, or failed. Put the recovery action where the failure occurred. Precision is assistance: explain a useful next step rather than displaying only a diagnostic code.
28
+
29
+ ## Keep change controlled
30
+
31
+ Retain context while results, details, and forms change. Prefer stable region boundaries during loading and filtering; preserve useful previous information when it remains valid. A save's pending state prevents duplicate submission without hiding the work. A failed save keeps the changed data visible and recoverable. Move keyboard focus when a new task surface requires orientation, and announce state changes without unnecessary interruptions.
32
+
33
+ Before leaving a changed editor, offer an explicit choice and preserve the draft when that choice is cancelled. Use reversible operations and undo where the domain permits. Explain irreversible consequences before commitment. Transitions may clarify state, but the same information must remain understandable without animation.
34
+
35
+ ## Let the frame follow the work
36
+
37
+ A horizontal navbar, side rail, or focused workspace without primary navigation can each be Krigsvold. Choose based on destination count, frequency, available space, and the task's need for persistent context. Vertical navigation is not a language rule. A reading page deserves the same coherent regional structure as an operations console.
38
+
39
+ At narrow widths, place regions in a meaningful reading order rather than compressing all of them into unusable columns. Keep the current object identifiable and supply a clear return route. Long labels, enlarged text, and translated content must not depend on fixed-width assumptions.
40
+
41
+ ## Choose a grouping, then a density
42
+
43
+ Assign orientation, query, work, supporting context and commands distinct jobs. Align comparable information within each job. Use a boundary when scope changes; do not repeat a border around every local relationship. A region can be compact internally while remaining clearly separated from the next region.
44
+
45
+ Use comfortable density for the current reference patterns. A compact mode remains proposed, with no new public density prop. Adjust related padding locally only while preserving readable text, usable targets, visible labels and the field/group/region hierarchy. Source page section spacing does not belong inside an editor. A source index or footer is an object-specific composition; it does not establish a universal application rail or surface.
46
+
47
+ ## Bind actions to committed scope
48
+
49
+ Put a field's assistance beside that field, object commands beside the object, and collection commands beside a named collection. A pending query and its previous results are different scopes: identify both. Retain input and useful results after failure, with a recovery action that names the failed operation. Selection belongs to stable record identities in a declared result scope; clearing, retaining or extending it must follow a documented transition, not an accidental rerender.
50
+
51
+ The validated-form and query-results contracts add concrete state transitions, focus destinations and narrow-layout rules. They are application extensions. Shared native keyboard conventions do not make the languages interchangeable, and a shared grammar rule does not imply the same framework API. The coverage ledger distinguishes documented rules, checked reference behavior and open consumer evidence.
52
+
53
+ ## Use layers for their actual purpose
54
+
55
+ An inline disclosure stays in document flow. A non-modal popup anchors to its trigger and retains the source navigation surface. A modal interrupts the task, names its consequence and uses the native dialog top layer with a clear dismissal route. A backdrop belongs to the modal; it is not required for every overlay. Keep focus visible and return it to a meaningful trigger when a temporary surface closes. Motion never carries the only explanation of a state change.
56
+
57
+ ## Working pattern: collection and detail workspace
58
+
59
+ The Notes workspace specimen puts collection scope and search in a common command region. Results use aligned rows with title, collection, and preview. A clear selected edge identifies the opened record. The detail region remains beside results when width permits, so a person can move through records without losing the collection. Editing is explicit and stays within the detail region. Local working density supports scanning; stronger separation distinguishes the collection from the current note.
60
+
61
+ When the available width is insufficient, results precede the detail region and opening a note moves focus to its heading. Closing returns focus to the collection heading. The layout changes while scope and task meanings persist.
62
+
63
+ This pattern does not require every Krigsvold application to use a split view. A sustained-reading task may use a dedicated page. The language's regional, alignment, contrast, and state rules apply in either frame.
64
+
65
+ ## State and recovery rules
66
+
67
+ Search names its scope and reports the result count. No matches offer a clear reset; an empty collection offers creation. Changing folders is an explicit context change. Opening and editing remain separate actions. Save success returns the note to a committed reading state; failure keeps the editor and offers retry. A context change from a changed editor requires a keep-or-discard choice. Moving a saved note to trash preserves an undo route.
68
+
69
+ The specimen contains fictional, session-only data. Reload restores initial examples. Its failure-inspection control deliberately fails one save and is separate from ordinary product commands. It does not implement network retrieval, durable storage, collaboration, or rich text.
70
+
71
+ ## Review the grammar
72
+
73
+ Can someone identify the current region, command scope, selected record, and save state without relying on color? Does aligned information support comparison? Are boundaries meaningful rather than repetitive decoration? Does the regional structure remain understandable in a compact table, a form, and a reading experience? Test these questions across complete transitions, not only the populated initial view.
74
+
75
+ Expected keyboard behavior and accessible semantics need not differ from Martlet. Independence comes from coherent decisions that serve the task, not arbitrary opposites. Manual assistive-technology review, localization, RTL adaptation, and sustained consumer evidence remain open before stability.