Both tabs were rendering Explore. They now take the whole screen, as the
reference does by hiding the unit on each: a list or a page of prose
wants the room more than the panel does. Picking a search result jumps
to Explore with that combo lit, which is the reference's data-go.
The rules text is extracted verbatim rather than retyped or reworded.
Two bugs on the way there, both worth recording:
- RULES is a template literal that itself contains template literals
inside a ${} interpolation, so the bracket scanner used for the combo
table stops at the first inner backtick. The nine title and body pairs
are matched out of the source instead, with a count assertion so drift
fails loudly rather than silently dropping a rule.
- PADMAP was read with g() but never added to the list of declarations
evaluated into the vm, so it was simply not in scope.
The extractor now asserts 9 rules and 4 pad-map rows alongside the 159
combos.
141 tests, typecheck clean. Both tabs verified by rendering them, Find
with a seeded query since headless Firefox cannot type.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
89 lines
1.3 KiB
CSS
89 lines
1.3 KiB
CSS
/* Takes the space the panel would use, and scrolls. */
|
|
|
|
.rules {
|
|
flex: 1 1 auto;
|
|
min-height: 0;
|
|
overflow-y: auto;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 10px;
|
|
padding-bottom: 4px;
|
|
}
|
|
|
|
.map {
|
|
background: var(--card);
|
|
border: var(--outline);
|
|
box-shadow: var(--shadow-sm);
|
|
padding: 8px 10px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 6px;
|
|
}
|
|
|
|
.mapHead {
|
|
margin: 0;
|
|
font-family: var(--mono);
|
|
font-size: 9px;
|
|
letter-spacing: 0.12em;
|
|
color: var(--muted);
|
|
}
|
|
|
|
.mapRow {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 3px;
|
|
}
|
|
|
|
.mapLabel {
|
|
margin: 0;
|
|
font-family: var(--mono);
|
|
font-size: 8.5px;
|
|
letter-spacing: 0.06em;
|
|
color: var(--muted);
|
|
}
|
|
|
|
.grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
gap: 4px;
|
|
}
|
|
|
|
.cell {
|
|
background: var(--page);
|
|
border: 1px solid var(--rule);
|
|
padding: 4px 5px;
|
|
font-size: 9.5px;
|
|
line-height: 1.15;
|
|
min-width: 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.cellNum {
|
|
display: block;
|
|
font-family: var(--mono);
|
|
font-size: 11px;
|
|
color: var(--accent);
|
|
}
|
|
|
|
.rule {
|
|
background: var(--card);
|
|
border: var(--outline);
|
|
box-shadow: var(--shadow-sm);
|
|
padding: 8px 10px;
|
|
}
|
|
|
|
.title {
|
|
margin: 0 0 3px;
|
|
font-size: 13.5px;
|
|
font-weight: 700;
|
|
line-height: 1.15;
|
|
}
|
|
|
|
.body {
|
|
margin: 0;
|
|
font-size: 12px;
|
|
line-height: 1.35;
|
|
color: var(--muted);
|
|
text-wrap: pretty;
|
|
}
|