fix: readability — solid dark backgrounds on all chat cards (v1.4.2)

Root cause: all chat card containers used rgba() with 0.2-0.4 opacity,
which becomes nearly transparent on Foundry v14 parchment chat bg.
Light text (white, cyan, yellow, green) was invisible on the result.

CSS fixes (solid dark backgrounds replacing transparent rgba):
- .panic-result: rgba(139,0,0,0.2) -> #1c0808 + color: #e0e0e0
- .panic-success: rgba(0,128,0,0.2) -> #081c08 + green text toned to #55ee55
- .panic-effect: rgba(0,0,0,0.4) -> #111111 + color: #e0e0e0
- .critical-injury: rgba(220,20,60,0.2) -> #1c080d + color: #e0e0e0
- .crit-effects/.crit-healing/.crit-recovery: rgba(0,0,0,0.3) -> #111111
- .time-limit: rgba(255,170,0,0.2) -> #1a1200

New CSS classes added (were missing entirely):
- .instability-result with dark bg, border, and sub-element rules
- .instability-no-effect, .instability-effect-text, .instability-auto-note
- .panic-auto (auto-applied row)
- .drug-gm-alert, .weapon-reload-chat

JS inline style fixes:
- Rest card: rgba(0,60,30,0.3) -> #0a1a0e (solid)
- Ammo empty card: rgba(80,20,0,0.3) -> #1a0800 (solid)
- Instability effect text: color:#333 (dark on dark) -> CSS class #d8d8d8
- Instability auto-note: color:#ffcc44 inline -> CSS class
This commit is contained in:
2026-06-02 22:05:05 +01:00
parent 76e086ca6c
commit 4e3554c28b
3 changed files with 86 additions and 20 deletions
+77 -11
View File
@@ -1519,11 +1519,12 @@
======================================== */ ======================================== */
.panic-result { .panic-result {
background: rgba(139, 0, 0, 0.2); background: #1c0808;
border: 2px solid #8b0000; border: 2px solid #8b0000;
border-radius: 6px; border-radius: 6px;
padding: 15px; padding: 15px;
margin: 10px 0; margin: 10px 0;
color: #e0e0e0;
} }
.panic-formula { .panic-formula {
@@ -1534,16 +1535,16 @@
.panic-total { .panic-total {
font-size: 20px; font-size: 20px;
color: #ff4444; color: #ff5555;
font-weight: bold; font-weight: bold;
} }
.panic-success { .panic-success {
background: rgba(0, 128, 0, 0.2); background: #081c08;
border: 2px solid #00aa00; border: 2px solid #00aa00;
border-radius: 4px; border-radius: 4px;
padding: 12px; padding: 12px;
color: #00ff00; color: #55ee55;
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
margin-top: 10px; margin-top: 10px;
@@ -1551,15 +1552,16 @@
} }
.panic-effect { .panic-effect {
background: rgba(0, 0, 0, 0.4); background: #111111;
border: 1px solid #ff4444; border: 1px solid #ff4444;
border-radius: 4px; border-radius: 4px;
padding: 12px; padding: 12px;
margin-top: 10px; margin-top: 10px;
color: #e0e0e0;
} }
.panic-effect strong { .panic-effect strong {
color: #ff6b6b; color: #ff7777;
font-size: 16px; font-size: 16px;
display: block; display: block;
margin-bottom: 8px; margin-bottom: 8px;
@@ -1568,11 +1570,12 @@
} }
.critical-injury { .critical-injury {
background: rgba(220, 20, 60, 0.2); background: #1c080d;
border: 2px solid #dc143c; border: 2px solid #dc143c;
border-radius: 6px; border-radius: 6px;
padding: 15px; padding: 15px;
margin: 10px 0; margin: 10px 0;
color: #e0e0e0;
} }
.crit-roll { .crit-roll {
@@ -1598,21 +1601,23 @@
} }
.time-limit { .time-limit {
background: rgba(255, 170, 0, 0.2); background: #1a1200;
border: 1px solid #ffaa00; border: 1px solid #ffaa00;
border-radius: 4px; border-radius: 4px;
padding: 8px; padding: 8px;
color: #ffaa00; color: #ffbb33;
font-weight: bold; font-weight: bold;
margin: 8px 0; margin: 8px 0;
} }
.crit-effects, .crit-effects,
.crit-healing { .crit-healing,
background: rgba(0, 0, 0, 0.3); .crit-recovery {
background: #111111;
border-radius: 4px; border-radius: 4px;
padding: 8px; padding: 8px;
margin: 8px 0; margin: 8px 0;
color: #d8d8d8;
} }
.crit-effects strong, .crit-effects strong,
@@ -1622,6 +1627,67 @@
margin-bottom: 4px; margin-bottom: 4px;
} }
/* ========================================
CHAT CARD — MISSING BACKGROUND FIX
All system chat output needs a solid dark background so that
coloured text remains readable regardless of Foundry's chat theme.
======================================== */
/* Instability roll result */
.instability-result {
background: #0e1a14;
border: 2px solid #ff6600;
border-radius: 6px;
padding: 10px 14px;
margin: 6px 0;
color: #e0e0e0;
}
.instability-result p { margin: 4px 0; color: #e0e0e0; }
.instability-result strong { color: #fff; }
.instability-no-effect { color: #55ee88 !important; font-weight: bold; }
.instability-effect-text { color: #d8d8d8 !important; font-size: 13px; line-height: 1.5; }
.instability-auto-note {
color: #ffcc55 !important;
font-size: 11px;
font-style: italic;
border-top: 1px solid rgba(255,204,85,0.3);
margin-top: 6px;
padding-top: 4px;
}
/* Panic result — auto-note row */
.panic-auto {
background: rgba(255, 200, 0, 0.1);
border: 1px solid rgba(255, 200, 0, 0.3);
border-radius: 3px;
padding: 4px 8px;
font-size: 12px;
color: #ffcc44;
margin-top: 6px;
}
.panic-auto strong { color: #ffe066; }
/* Drug GM alert (stamina strain, drug state) */
.drug-gm-alert {
background: #0d0d1a;
border: 1px solid rgba(0, 180, 255, 0.4);
border-radius: 5px;
padding: 8px 12px;
color: #c0d8ff;
font-size: 13px;
}
.drug-gm-alert strong { color: #88ccff; }
/* Weapon reload notification */
.weapon-reload-chat {
background: #0d1a0d;
border: 1px solid rgba(0, 200, 100, 0.35);
border-radius: 5px;
padding: 7px 10px;
color: #b8eec8;
font-size: 13px;
}
/* ======================================== /* ========================================
ROLLABLE INDICATOR ROLLABLE INDICATOR
======================================== */ ======================================== */
+1 -1
View File
@@ -2,7 +2,7 @@
"id": "zero-engine", "id": "zero-engine",
"title": "Zero Engine (SLA Industries)", "title": "Zero Engine (SLA Industries)",
"description": "A basic game system for SLA Industries using the Zero Engine rules.", "description": "A basic game system for SLA Industries using the Zero Engine rules.",
"version": "1.4.1", "version": "1.4.2",
"compatibility": { "compatibility": {
"minimum": 13, "minimum": 13,
"verified": "14.359" "verified": "14.359"
+8 -8
View File
@@ -1644,9 +1644,9 @@ class ZeroEngineActorSheet extends foundry.appv1.sheets.ActorSheet {
ui.notifications.info(`${actor.name} rests — weapons restored: ${names}`); ui.notifications.info(`${actor.name} rests — weapons restored: ${names}`);
await ChatMessage.create({ await ChatMessage.create({
speaker: ChatMessage.getSpeaker({ actor }), speaker: ChatMessage.getSpeaker({ actor }),
content: `<div style="border:2px solid #00a860;border-radius:6px;padding:8px 12px;background:rgba(0,60,30,0.3);margin:4px 0;"> content: `<div style="border:2px solid #00a860;border-radius:6px;padding:8px 12px;background:#0a1a0e;margin:4px 0;">
<strong style="color:#55ffaa;font-size:14px;">🛏 ${actor.name} — RESTING</strong><br> <strong style="color:#55ffaa;font-size:14px;">🛏 ${actor.name} — RESTING</strong><br>
<span style="color:#ccc;font-size:12px;">Weapons restored: <strong>${names}</strong></span> <span style="color:#c8c8c8;font-size:12px;">Weapons restored: <strong style="color:#fff;">${names}</strong></span>
</div>` </div>`
}); });
} }
@@ -1712,7 +1712,7 @@ class ZeroEngineActorSheet extends foundry.appv1.sheets.ActorSheet {
await ChatMessage.create({ await ChatMessage.create({
speaker: ChatMessage.getSpeaker({ actor }), speaker: ChatMessage.getSpeaker({ actor }),
flavor: `<strong>🔀 ${actor.name} — Instability Check</strong>`, flavor: `<strong>🔀 ${actor.name} — Instability Check</strong>`,
content: `<div class="instability-result"><p>Rolled <strong>${dieVal}</strong> + Instability <strong>${currentInstability}</strong> = <strong>${total}</strong></p><p style="color:#44cc88;">✓ Held together. No effect.</p></div>`, content: `<div class="instability-result"><p>Rolled <strong>${dieVal}</strong> + Instability <strong>${currentInstability}</strong> = <strong>${total}</strong></p><p class="instability-no-effect">✓ Held together. No effect.</p></div>`,
rolls: [roll] rolls: [roll]
}); });
return; return;
@@ -1730,7 +1730,7 @@ class ZeroEngineActorSheet extends foundry.appv1.sheets.ActorSheet {
let content = `<div class="instability-result">`; let content = `<div class="instability-result">`;
content += `<p>Rolled <strong>${dieVal}</strong> + Instability <strong>${currentInstability}</strong> = <strong>${total}</strong></p>`; content += `<p>Rolled <strong>${dieVal}</strong> + Instability <strong>${currentInstability}</strong> = <strong>${total}</strong></p>`;
content += `<p style="color:${severityColour};font-size:14px;font-weight:bold;">${entry.name}</p>`; content += `<p style="color:${severityColour};font-size:14px;font-weight:bold;">${entry.name}</p>`;
content += `<p style="color:#333;">${entry.effect}</p>`; content += `<p class="instability-effect-text">${entry.effect}</p>`;
// Auto-apply immediate mechanical effects // Auto-apply immediate mechanical effects
const updates = {}; const updates = {};
@@ -1777,7 +1777,7 @@ class ZeroEngineActorSheet extends foundry.appv1.sheets.ActorSheet {
await actor.update(updates); await actor.update(updates);
} }
if (notes.length > 0) { if (notes.length > 0) {
content += `<p style="color:#ffcc44;font-size:11px;font-style:italic;">Auto-applied: ${notes.join(' | ')}</p>`; content += `<p class="instability-auto-note">Auto-applied: ${notes.join(' | ')}</p>`;
} }
content += '</div>'; content += '</div>';
@@ -2588,9 +2588,9 @@ class ZeroEngineActorSheet extends foundry.appv1.sheets.ActorSheet {
await weaponItem.update({ 'system.ammoEmpty': true }); await weaponItem.update({ 'system.ammoEmpty': true });
await ChatMessage.create({ await ChatMessage.create({
speaker: ChatMessage.getSpeaker({ actor }), speaker: ChatMessage.getSpeaker({ actor }),
content: `<div style="border:2px solid #cc4400;border-radius:6px;padding:8px 12px;background:rgba(80,20,0,0.3);margin:4px 0;"> content: `<div style="border:2px solid #cc4400;border-radius:6px;padding:8px 12px;background:#1a0800;margin:4px 0;">
<strong style="color:#ff6633;font-size:14px;">🔒 ${weaponInfo.name} — OUT OF AMMO</strong><br> <strong style="color:#ff7755;font-size:14px;">🔒 ${weaponInfo.name} — OUT OF AMMO</strong><br>
<span style="color:#ccc;font-size:12px;">A stress die came up 1 on the push — the weapon has run dry. Rest to restore ammunition.</span> <span style="color:#c8c8c8;font-size:12px;">A stress die came up 1 on the push — the weapon has run dry. Rest to restore ammunition.</span>
</div>` </div>`
}); });
} }