diff --git a/quickdraw-game.html b/quickdraw-game.html
index 82e73be..59bca07 100644
--- a/quickdraw-game.html
+++ b/quickdraw-game.html
@@ -11,7 +11,13 @@
font-family: sans-serif;
}
:root {
+ /**
--bg: #161616;
+ --bg-green: #182118;
+ --fg-green: #e1ffdb;
+ */
+ --bg: #182118;
+ --fg: #e1ffdb;
}
html {
height: 100vh;
@@ -37,7 +43,7 @@
#center {
height: 50px;
width: 50px;
- background-color: red;
+ background-color: var(--fg);
/** border: 5px solid red; */
border-radius: 50%;
position: absolute;
@@ -48,7 +54,7 @@
height: 50px;
width: 50px;
background-color: var(--bg);
- border: 10px solid red;
+ border: 10px solid var(--fg);
position: absolute;
border-radius: 50%;
}
@@ -57,7 +63,7 @@
}
.target::after {
position: absolute;
- background-color: red;
+ background-color: var(--fg);
border-radius: 2rem;
height: 10px;
width: 10px;
@@ -69,7 +75,7 @@
.red-dot {
height: 50px;
width: 50px;
- background-color: red;
+ background-color: var(--fg);
position: absolute;
border-radius: 50%;
}
@@ -104,7 +110,7 @@
min-height: 15%;
width: 100%;
- color: red;
+ color: var(--fg);
text-align: center;
line-height: 1rem;
@@ -129,9 +135,9 @@
button {
background-color: var(--bg);
- color: red;
+ color: var(--fg);
padding: 12px 12px;
- border: 2px solid red;
+ border: 2px solid var(--fg);
border-radius: 1rem;
font-size: .75rem;
font-weight: bold;
@@ -141,7 +147,7 @@
text-decoration: underline;
}
button:active {
- background-color: red;
+ background-color: var(--fg);
color: var(--bg);
font-style: italic;
}
@@ -526,7 +532,7 @@
if (roundNumber == maxNormalRounds) {
if (totalTime < highScore || highScore == 0) {
if (highScore == 0) {
- alert("high score set!");
+ alert("high score set, congratulations! can you go faster?");
}
else {
alert("NEW FASTEST TIME!!! previous best: " + highScore.toFixed(3) + "s. congratulations cowboy.");