Lucas 'Paperboy' Rose-Winters
3873eb82b1
fix: Use theme system CSS variables for modal/menu backgrounds
How theming actually works:
- Themes set CSS variables on .rpg-panel[data-theme="..."]
(--rpg-bg, --rpg-accent, --rpg-text, --rpg-highlight, --rpg-border)
- Elements inside .rpg-panel inherit these solid-color variables
- Base .rpg-modal-content already uses var(--rpg-accent) gradient
Solution:
1. Copy data-theme attribute from panel to modals/menus
2. Define theme variables for .rpg-modal-content[data-theme]
3. Variables automatically apply to gradient background
Now modals/menus inherit theme styling through CSS variables:
- Sci-fi: --rpg-bg: #0a0e27, --rpg-accent: #1a1f3a
- Fantasy: --rpg-bg: #2b1810, --rpg-accent: #3d2414
- Cyberpunk: --rpg-bg: #000000, --rpg-accent: #0d0d0d
- Custom themes: Just work through variable system
Changes:
- style.css: Add variable definitions for themed .rpg-modal-content
- promptDialog.js: Copy data-theme from panel
- tabContextMenu.js: Copy data-theme (menu + icon picker)
2025-11-04 14:33:59 +11:00
..
2025-11-04 10:34:31 +11:00
2025-10-28 11:14:51 +11:00
2025-11-04 13:34:36 +11:00
2025-11-04 10:54:28 +11:00
2025-11-04 13:34:36 +11:00
2025-11-03 11:12:10 +11:00
2025-10-23 09:26:10 +11:00
2025-10-30 08:07:53 +11:00
2025-10-23 09:56:42 +11:00
2025-10-23 10:23:00 +11:00
2025-11-04 13:34:36 +11:00
2025-10-30 08:07:53 +11:00
2025-11-02 19:43:16 +11:00
2025-10-23 19:32:27 +11:00
2025-10-23 10:34:47 +11:00
2025-11-04 14:33:59 +11:00
2025-10-30 08:07:53 +11:00
2025-10-23 10:03:44 +11:00
2025-11-02 20:38:45 +11:00
2025-11-04 14:33:59 +11:00
2025-10-27 20:41:36 +11:00
2025-10-23 09:56:42 +11:00
2025-10-23 09:42:02 +11:00
2025-10-27 14:48:38 +11:00
2025-10-23 08:56:00 +11:00
2025-10-23 10:47:39 +11:00
2025-10-24 18:55:38 +11:00
2025-10-23 09:12:39 +11:00