fix: Use solid RGB colors for modal and menu backgrounds

Problem: CSS variables --rpg-bg and --rpg-accent have 0.9 opacity,
making all modals and menus transparent even with gradient backgrounds.

Solution: Use solid RGB colors directly in gradients:
- rgba(22, 33, 62, 1) instead of var(--rpg-accent)
- rgba(26, 26, 46, 1) instead of var(--rpg-bg)

Changes:
- style.css: .rpg-modal-content uses solid gradient
- tabContextMenu.js: Context menu uses solid gradient
- Both maintain inset shadow for depth
- Mobile long-press support included

Now modals and context menus have opaque backgrounds matching
widget styling instead of see-through transparency.
This commit is contained in:
Lucas 'Paperboy' Rose-Winters
2025-11-04 14:24:31 +11:00
parent 2ab48190ea
commit bedfbc77d5
3 changed files with 130 additions and 152 deletions
+2 -2
View File
@@ -1479,13 +1479,13 @@ body:has(.rpg-panel.rpg-position-left) #sheld {
/* Modal Content Container */
.rpg-modal-content {
background: var(--rpg-bg);
background: linear-gradient(135deg, rgba(22, 33, 62, 1) 0%, rgba(26, 26, 46, 1) 100%);
border: 2px solid var(--rpg-border);
border-radius: 8px;
max-width: 600px;
max-height: 80vh;
overflow: auto;
box-shadow: 0 4px 20px var(--rpg-shadow);
box-shadow: 0 4px 18px var(--rpg-shadow), inset 0 0 12px rgba(0, 0, 0, 0.3);
}
/* Modal Header */