diff --git a/src/App.css b/src/App.css
index 676f39461..d4055e864 100644
--- a/src/App.css
+++ b/src/App.css
@@ -139,6 +139,12 @@ table.Game-rows > tbody {
color: white !important;
}
+.letter-red {
+ border: 2px solid rgba(0, 0, 0, 0.3);
+ background-color: #ff0000;
+ color: white !important;
+}
+
body.dark {
background-color: #404040;
color: #e0e0e0;
diff --git a/src/App.tsx b/src/App.tsx
index c40a20687..3d81f282c 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -72,6 +72,7 @@ function App() {
style={{
color: difficulty > 0 ? "#e66" : "inherit",
fontStyle: difficulty > 1 ? "italic" : "inherit",
+ fontStyle: difficulty > 2 ? "bold" : "inherit", // I have no idea what this syntax means. I'm just mimicing and hoping for the best
}}
>
hell
@@ -126,13 +127,13 @@ function App() {
id="difficulty-setting"
type="range"
min="0"
- max="2"
+ max="3"
value={difficulty}
onChange={(e) => setDifficulty(+e.target.value)}
/>
-
{["Normal", "Hard", "Ultra Hard"][difficulty]}
+
{["Normal", "Hard", "Ultra Hard", "IMPOSSIBLE"][difficulty]}
diff --git a/src/Game.tsx b/src/Game.tsx
index 05617b099..b0b455969 100644
--- a/src/Game.tsx
+++ b/src/Game.tsx
@@ -337,8 +337,8 @@ function Game(props: GameProps) {