39 lines
1.9 KiB
Markdown
39 lines
1.9 KiB
Markdown
# Redesign platform web themes and menu
|
|
|
|
## Summary
|
|
|
|
Redesign the platform web console shell so the default visual theme becomes a black mecha operations style, while the magical-girl theme remains available as a selectable theme with stronger magic-circle and sparkle effects.
|
|
|
|
## Motivation
|
|
|
|
The previous shell used one magical-girl-leaning visual direction for all palettes. The requested direction requires two clearly distinct theme families:
|
|
|
|
- A default black mecha console for day-to-day game server operations.
|
|
- A selectable magical-girl theme matching the reference style: semi-transparent frosted-glass sidebar states, bold title treatment, brighter star borders, and more visible magic circles.
|
|
|
|
Theme differences must affect more than colors. Navigation surfaces, cards, panels, particle effects, frame materials, and theme documentation need to describe and enforce the new split.
|
|
|
|
## Scope
|
|
|
|
- Change the default theme palette/background to a black mecha style.
|
|
- Keep magical-girl as an optional first-party theme.
|
|
- Rework the shell navigation into an expanded text sidebar and collapsed icon rail inspired by the provided references.
|
|
- Add a sidebar collapse / expand toggle.
|
|
- Strengthen theme-aware global effects in `MagicalParticleLayer` without canvas or expensive particle loops.
|
|
- Make shared framed surfaces visually differ between mecha and magical themes.
|
|
- Update theme documentation and tests.
|
|
|
|
## Out of Scope
|
|
|
|
- Billing, cloud host sales, agent-provider marketplace workflows, or unrelated SaaS marketplace features.
|
|
- Third-party character art or bundled recognizable copyrighted assets.
|
|
- Replacing first-party console pages or changing backend behavior.
|
|
|
|
## Verification
|
|
|
|
- Run theme unit tests.
|
|
- Run frontend typecheck/build where practical.
|
|
- Run `scripts/check-structure.sh`.
|
|
- Run `openspec validate redesign-platform-web-themes-menu --strict`.
|
|
- Perform a browser walkthrough for the changed shell/menu UI before claiming visual acceptance.
|