Improve feedback readability under dark overlay

This commit is contained in:
chris 2025-11-20 09:18:17 -05:00
parent ea5b13bf1a
commit 850b6ab774
2 changed files with 11 additions and 4 deletions

6
app.js
View File

@ -257,7 +257,7 @@
}
castPatronus();
feedback.style.color = 'green';
feedback.style.color = '#7cff9a';
feedback.innerText = `Expecto Patronum! (+${goldGain} G)`;
if (allFactsMastered(state.levelIndex) && state.levelIndex < CURRICULUM.length - 1) {
@ -293,10 +293,10 @@
document.getElementById('answer-display').innerText = "";
if (game.attempts >= 3) {
feedback.style.color = '#740001';
feedback.style.color = '#ffb0b0';
feedback.innerText = `Answer is ${game.currentFact.ans}.`;
} else {
feedback.style.color = '#740001';
feedback.style.color = '#ffb0b0';
feedback.innerText = "Count the stars...";
drawHintGrid(game.currentFact.n1, game.currentFact.n2);
}

View File

@ -312,7 +312,14 @@
}
.card-container .key-btn.key-clear:active { background: #f1c232; }
.feedback { height: 20px; margin: 5px 0; font-weight: bold; font-size: 0.9rem; }
.feedback {
height: 20px; margin: 5px 0; font-weight: bold; font-size: 1rem;
color: #fffdf2;
text-shadow:
0 0 calc(4px + 10px * var(--focus-glow)) rgba(255, 245, 230, calc(0.4 + 0.45 * var(--focus-glow))),
0 0 calc(8px + 16px * var(--focus-glow)) rgba(0, 0, 0, 0.55);
-webkit-text-stroke: 0.5px rgba(0,0,0,0.35);
}
.quick-consumables {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));