Compare commits

..

11 Commits

Author SHA1 Message Date
cee92eae3c update countries repo commit 2024-01-31 18:24:31 +00:00
9866553bf0 fix css 2022-04-13 17:38:06 +01:00
b4c3ddcfe0 update to new colors styling location 2022-04-13 17:32:05 +01:00
2311497f63 prepare for new styling update 2022-04-13 17:08:03 +01:00
cf2e7abf28 more fixing styles 2022-04-13 03:00:40 +01:00
925c7744fe more fixing styles 2022-04-13 02:59:24 +01:00
0f44c34f65 more fixing styles 2022-04-13 02:57:14 +01:00
cf94bcf486 update styles 2022-04-13 02:55:01 +01:00
38b1530202 fix homepage link 2022-04-12 04:54:11 +01:00
ab4a81ab5b switch to styles.alv.cx 2022-04-03 21:38:57 +01:00
b2f37589ec bug fix 2022-02-04 23:02:11 +00:00
5 changed files with 24 additions and 30 deletions

View File

@@ -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;
};

View File

@@ -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 {

View File

@@ -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>

View File

@@ -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) {