mirror of
https://github.com/alvierahman90/capitals_quiz.git
synced 2026-02-11 18:53:59 +00:00
Compare commits
11 Commits
8b2695f241
...
main
| Author | SHA1 | Date | |
|---|---|---|---|
|
cee92eae3c
|
|||
|
9866553bf0
|
|||
|
b4c3ddcfe0
|
|||
|
2311497f63
|
|||
|
cf2e7abf28
|
|||
|
925c7744fe
|
|||
|
0f44c34f65
|
|||
|
cf94bcf486
|
|||
|
38b1530202
|
|||
|
ab4a81ab5b
|
|||
|
b2f37589ec
|
Submodule countries updated: 218e5a214b...8a32e60d9b
4
game.js
4
game.js
@@ -47,13 +47,13 @@ const getMasterQuestionList = () => {
|
||||
};
|
||||
|
||||
const getQuestionByCountryName = (name) => {
|
||||
c = getMasterQuestionList().filter((c) => c.countryname === name);
|
||||
var c = getMasterQuestionList().filter((c) => c.countryname === name);
|
||||
if (c.length > 0) return c[0];
|
||||
return null;
|
||||
};
|
||||
|
||||
const getQuestionByCapital = (capital) => {
|
||||
c = getMasterQuestionList().filter((c) => c.capital === capital);
|
||||
var c = getMasterQuestionList().filter((c) => c.capital === capital);
|
||||
if (c.length > 0) return c[0];
|
||||
return null;
|
||||
};
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
--b-color: var(--yellow);
|
||||
--c-color: var(--green);
|
||||
--d-color: var(--blue);
|
||||
--question-country-color: var(--teal);
|
||||
--question-country-color: var(--base16-teal);
|
||||
--question-capital-color: var(--blue);
|
||||
}
|
||||
|
||||
@@ -21,25 +21,25 @@ input {
|
||||
|
||||
@keyframes correct {
|
||||
0% {
|
||||
background: var(--default-bg);
|
||||
background: var(--bg);
|
||||
}
|
||||
50% {
|
||||
background: var(--green);
|
||||
}
|
||||
100% {
|
||||
background: var(--default-bg);
|
||||
background: var(--bg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes incorrect {
|
||||
0% {
|
||||
background: var(--default-bg);
|
||||
background: var(--bg);
|
||||
}
|
||||
50% {
|
||||
background: var(--red);
|
||||
}
|
||||
100% {
|
||||
background: var(--default-bg);
|
||||
background: var(--bg);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -74,10 +74,12 @@ input {
|
||||
--okay: var(--yellow);
|
||||
--bad: var(--red);
|
||||
background: var(--good);
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
#time {
|
||||
background: var(--blue);
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
#gameinfo {
|
||||
@@ -90,6 +92,7 @@ input {
|
||||
|
||||
#previousQuestionAnswer {
|
||||
background: var(--green);
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
#game .answer {
|
||||
@@ -113,29 +116,35 @@ input {
|
||||
#a {
|
||||
background-color: var(--a-color);
|
||||
border-color: var(--a-color);
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
#b {
|
||||
background-color: var(--b-color);
|
||||
border-color: var(--b-color);
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
#c {
|
||||
background-color: var(--c-color);
|
||||
border-color: var(--c-color);
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
#d {
|
||||
background-color: var(--d-color);
|
||||
border-color: var(--d-color);
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
span#questionCountry {
|
||||
background-color: var(--question-country-color);
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
span#questionCapital {
|
||||
background-color: var(--question-capital-color);
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
#settings {
|
||||
@@ -154,8 +163,8 @@ span#questionCapital {
|
||||
}
|
||||
|
||||
#settings .regionListItem:hover {
|
||||
background: #d9d9d9;
|
||||
color: black;
|
||||
background: var(--light);
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
/* toggle switches */
|
||||
@@ -242,6 +251,7 @@ input[type="radio"] + label {
|
||||
}
|
||||
input[type="radio"]:checked + label {
|
||||
background-color: var(--yellow);
|
||||
color: var(--dark);
|
||||
}
|
||||
|
||||
#previousQuestionAnswer {
|
||||
|
||||
@@ -90,7 +90,7 @@
|
||||
</div>
|
||||
<p>
|
||||
built with ❤ and adequate amounts of care by
|
||||
<a href="https://alra.uk">alv</a>
|
||||
<a href="https://alv.cx">alv</a>
|
||||
</p>
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<script type="text/javascript" src="countries.js"></script>
|
||||
|
||||
22
styles.css
22
styles.css
@@ -1,30 +1,14 @@
|
||||
@import url("https://alv.cx/styles.css");
|
||||
|
||||
:root {
|
||||
--default-bg: #fefefe;
|
||||
--dark-bg: #b8b8b8;
|
||||
--selected-bg: #383838;
|
||||
--default-fg: #454545;
|
||||
--red: #ab4642;
|
||||
--orange: #dc9656;
|
||||
--yellow: #f7ca88;
|
||||
--green: #a1b56c;
|
||||
--teal: #86c1b9;
|
||||
--blue: #7cafc2;
|
||||
--purple: #ba8baf;
|
||||
--brown: #a16946;
|
||||
}
|
||||
@import url("https://styles.alv.cx/colors/base16-default.css");
|
||||
@import url("https://styles.alv.cx/base.css");
|
||||
@import url("https://styles.alv.cx/modules/darkmode.css");
|
||||
|
||||
body {
|
||||
font-family: monospace;
|
||||
color: var(--default-fg);
|
||||
font-size: 16px;
|
||||
margin: 0 auto;
|
||||
max-width: 800px;
|
||||
padding: 2em;
|
||||
line-height: 1.1;
|
||||
text-align: justify;
|
||||
background-color: var(--default-bg);
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 600px) {
|
||||
|
||||
Reference in New Issue
Block a user