M5: Codex design system (dark theme) + kitchen-sink
Programmatic Theme builder + reusable popover and stepper widgets, ported from CharacterCreator.zip's :root design tokens. Kitchen-sink scene exercises every primitive for visual eyeballing. CodexPalette.cs: Color tokens lifted verbatim from the React prototype's `:root` block (--bg, --ink, --gild, --seal, etc.). Variable names mirror the CSS so the audit trail stays readable. Spacing locked at the prototype's normal density (--gap=24, --pad=28, --radius=2). Scope cut: only the Dark theme ships. The React prototype designed Parchment, Dark, and Blood as switchable variations — user direction during M5 is that only Dark (leather + candlelight) is wanted for this game. Parchment/Blood code dropped, plan doc updated to match (§1 goal #5, §4.5 UI map, §5 M5 scope, §10 resolved decisions #4). No runtime theme switcher. CodexTheme.Build(): Programmatically constructs a Godot Theme from CodexPalette.Dark plus CodexSpacing/CodexType tokens. Configures Panel, Card, CodexPopover styleboxes; Label variations for H1..H4, CodexTitle, Eyebrow, Meta, ValidationOk/Error, CardName/Body/Meta, StepperNum/ Name; Button + PrimaryButton + GhostButton variants; LineEdit, CheckBox, scrollbar styling. Fonts: looks for CormorantGaramond / CrimsonPro / JetBrainsMono TTFs in res://Fonts/ (or Content/Fonts/) and graceful-falls-back to Godot defaults if missing. M5 ships with no fonts in repo; user can drop them in later for typography parity with the React prototype. CodexPopover.cs: Hoverable text trigger + floating PanelContainer, mirrors src/trait-hint.jsx. Viewport-clamps horizontally and vertically; flips above the trigger if there's no room below; 80 ms grace period when moving cursor from trigger to popover. Detriment variant uses the seal-coloured stylebox. Future TraitName / SkillChip / BonusPill widgets layer className differences on top. CodexStepper.cs: Roman-numeral horizontal stepper with Pending / Active / Complete / Locked states. Active step gets a 2-px gild underline, Complete shows a ✓ in seal-red, Locked shows ✕ + 0.45 modulate. Emits StepClicked(int) for non-locked rows. M5 is decorative — M6 wires the signal to the character-creation state machine. KitchenSink.cs + Main.cs --codex-test: Verification scene rendering every primitive (header, stepper, buttons, inputs, cards, trait popovers). Clicks log to console. Fonts default to Godot's Noto Sans until res://Fonts/ is populated. Closes M5 of theriapolis-rpg-implementation-plan-godot-port.md. Next: M6 (title + character creation). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
@@ -55,10 +55,10 @@ architecture test gets a one-line update (the forbidden namespace becomes
|
||||
dungeon, plus the Phase-7 dialogue→combat overlay. *Visual* parity with
|
||||
today's CodexUI is **not** a goal — the React prototype is the new
|
||||
baseline. Behavioural parity (what each screen *does*) is the goal.
|
||||
5. **Ship all three themes.** Parchment (default), dark (leather &
|
||||
candlelight), blood (warm crimson). The React prototype already designed
|
||||
them; Godot's Theme + ThemeVariation system makes shipping all three
|
||||
approximately free. Theme is a runtime player setting, not a dev tweak.
|
||||
5. **Ship the dark theme only.** The React prototype designed Parchment,
|
||||
Dark, and Blood; the user's call during M5 is that only Dark (leather +
|
||||
candlelight) is wanted for this game. Parchment and Blood are dropped
|
||||
from scope. No runtime theme switcher — there is one theme.
|
||||
6. **Tests still green.** All ~700 Core/worldgen/determinism/save tests pass
|
||||
unchanged. Project builds and runs `dotnet test` and the headless
|
||||
`Theriapolis.Tools` CLI exactly as before.
|
||||
@@ -270,8 +270,7 @@ only; do not preserve its visual choices.
|
||||
|
||||
| React prototype (CharacterCreator.zip) | Godot equivalent |
|
||||
|-----------------------------------------------------|--------------------------------------------------------|
|
||||
| CSS custom properties (`--bg`, `--ink`, `--gild`, ...) | `Theme` resource type variations (one per theme) |
|
||||
| `[data-theme="dark"]` / `[data-theme="blood"]` | `ThemeVariation` resources, switched via player setting|
|
||||
| CSS custom properties (`--bg`, `--ink`, `--gild`, ...) | Single `Theme` resource constructed in `CodexTheme.cs`|
|
||||
| `.codex-header`, `.codex-title`, `.codex-sub` | `PanelContainer` + `Label` with display font theme |
|
||||
| `.stepper` / `.step` / `.step.active/.complete/.locked` | Custom `HBoxContainer` script with state-driven theme |
|
||||
| `.page` (two-column main + aside) | `HSplitContainer` or `HBoxContainer` (fixed ratio) |
|
||||
@@ -384,8 +383,8 @@ foundation every subsequent screen builds on.
|
||||
`--bg` / `--ink` / `--gild` / `--seal` / `--rule` mapped to Theme constants;
|
||||
display + body fonts as Theme default fonts; standard spacing/radius
|
||||
constants.
|
||||
- `Theme/Variations/dark.tres` and `Theme/Variations/blood.tres`: ThemeVariations
|
||||
for the other two themes. Player setting selects the active variation.
|
||||
- ~~Theme variations for Parchment + Blood~~ — dropped during M5 per
|
||||
user decision; Dark only.
|
||||
- Fonts: copy Cormorant Garamond, Crimson Pro, Spectral, EB Garamond, Cinzel,
|
||||
Uncial Antiqua, JetBrains Mono into `res://Fonts/`. Bundle as `FontFile`
|
||||
resources at the sizes the prototype uses (verify by spot-rendering each).
|
||||
@@ -712,8 +711,8 @@ The bright line: **anything that touches `WorldState`, `PlayerCharacter`,
|
||||
default. The Theme must scale legibly across 1920×1080 / 2560×1440 /
|
||||
3840×2160. F11 (or `--windowed`) toggles to a windowed mode for
|
||||
iteration. Configured in M9.
|
||||
4. **Default theme.** Parchment. Dark and blood ship as player-selectable
|
||||
variations in the existing settings screen.
|
||||
4. **Theme.** Dark only (leather + candlelight palette). Parchment and
|
||||
Blood dropped from scope during M5; no runtime theme switcher.
|
||||
|
||||
### Open questions for the user / project lead
|
||||
|
||||
|
||||
Reference in New Issue
Block a user