monkeytypegame/monkeytype
1
1
Fork 0
mirror of https://github.com/monkeytypegame/monkeytype.git synced 2024-09-21 07:46:15 +08:00
Code Issues Packages Projects Releases Wiki Activity

renamed extra test color to colorful mode

Browse source
This commit is contained in:
Jack 2020-06-27 00:49:05 +01:00
parent a50d9017e1
commit 492d742842
48 changed files with 132 additions and 131 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
public/css/style.scss
View file

@ -942,39 +942,39 @@ key {
}
}
#words.extraColor{
#words.colorfulMode{
.word{
& letter.correct{
color: var(--main-color);
}
& letter.incorrect{
color: var(--extra-error-color);
color: var(--colorful-error-color);
}
& letter.incorrect.extra{
color: var(--extra-error-extra-color);
color: var(--colorful-error-extra-color);
}
}
}
#words.flipped.extraColor{
#words.flipped.colorfulMode{
.word{
color: var(--main-color);
& letter.correct{
color: var(--sub-color);
}
& letter.incorrect{
color: var(--extra-error-color);
color: var(--colorful-error-color);
}
& letter.incorrect.extra{
color: var(--extra-error-extra-color);
color: var(--colorful-error-extra-color);
}
}
}
#words.flipped.extraColor .word.error,
#words.extraColor .word.error
#words.flipped.colorfulMode .word.error,
#words.colorfulMode .word.error
{
border-bottom: 2px solid var(--extra-error-color);
border-bottom: 2px solid var(--colorful-error-color);
}
.pageTest #resultExtraButtons{

26
public/index.html
View file

@ -226,7 +226,7 @@
<input id="wordsInput" class="" tabindex="0" autocomplete="off"></input>
<div id="wordsTitle">input history</div>
<div id="timerNumber">60</div>
<div id="words" class="extraColor"></div>
<div id="words" class=""></div>
<div id="liveWpm">123</div>
<div class="buttons">
<div id="restartTestButton" class="" tabindex="0" onclick="this.blur();"><i class="fas fa-fw fa-redo-alt"></i></div>
@ -400,10 +400,10 @@
<div class="button off" tabindex="0" onclick="this.blur();">off</div>
</div>
</div>
<div class="section extraTestColor">
<h1>extra test color</h1>
<div class="section colorfulMode">
<h1>colorful mode</h1>
<div class="text">
When enabled, the test words will use the main color, instead of the text color.
When enabled, the test words will use the main color, instead of the text color, making the website more colorful.
</div>
<div class="buttons">
<div class="button on" tabindex="0" onclick="this.blur();">on</div>
@ -713,17 +713,17 @@
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.min.js"></script> -->
<script src="js/chart.js"></script>
<script src="js/chartjs-plugin-trendline.js?v=20"></script>
<script src="js/chartjs-plugin-trendline.js?v=21"></script>
<script src="js/chartjs-plugin-annotation.js"></script>
<script src="js/html2canvas.js"></script>
<script src="js/words.js?v=20"></script>
<script src="js/layouts.js?v=20"></script>
<script src="js/db.js?v=20"></script>
<script src="js/userconfig.js?v=20"></script>
<script src="js/commandline.js?v=20"></script>
<script src="js/settings.js?v=20"></script>
<script src="js/account.js?v=20"></script>
<script src="js/script.js?v=20"></script>
<script src="js/words.js?v=21"></script>
<script src="js/layouts.js?v=21"></script>
<script src="js/db.js?v=21"></script>
<script src="js/userconfig.js?v=21"></script>
<script src="js/commandline.js?v=21"></script>
<script src="js/settings.js?v=21"></script>
<script src="js/account.js?v=21"></script>
<script src="js/script.js?v=21"></script>
</html>

4
public/js/commandline.js
View file

@ -97,10 +97,10 @@ let commands = {
}
},
{
id: "toggleExtraTestColor",
id: "toggleColorfulMode",
display: "Toggle extra test color",
exec: () => {
toggleExtraTestColor();
toggleColorfulMode();
}
},
{

6
public/js/script.js
View file

@ -1372,11 +1372,11 @@ function flipTestColors(tf){
}
}
function applyExtraTestColor(tc){
function applyColorfulMode(tc){
if(tc){
$("#words").addClass('extraColor');
$("#words").addClass('colorfulMode');
}else{
$("#words").removeClass('extraColor');
$("#words").removeClass('colorfulMode');
}
}

18
public/js/settings.js
View file

@ -63,7 +63,7 @@ function updateSettingsPage(){
setSettingsButton('quickEnd', config.quickEnd);
setSettingsButton('flipTestColors', config.flipTestColors);
setSettingsButton('discordDot', config.showDiscordDot);
setSettingsButton('extraTestColor', config.extraTestColor);
setSettingsButton('colorfulMode', config.colorfulMode);
setSettingsButton('maxConfidence', config.maxConfidence);
setActiveThemeButton();
@ -400,15 +400,15 @@ $(".pageSettings .section.flipTestColors .buttons .button.off").click(e => {
})
//extra color
$(".pageSettings .section.extraTestColor .buttons .button.on").click(e => {
setExtraTestColor(true);
showNotification('Extra test color on', 1000);
setSettingsButton('extraTestColor', config.extraTestColor);
$(".pageSettings .section.colorfulMode .buttons .button.on").click(e => {
setColorfulMode(true);
showNotification('Colorful mode on', 1000);
setSettingsButton('colorfulMode', config.colorfulMode);
})
$(".pageSettings .section.extraTestColor .buttons .button.off").click(e => {
setExtraTestColor(false);
showNotification('Extra test color off', 1000);
setSettingsButton('extraTestColor', config.extraTestColor);
$(".pageSettings .section.colorfulMode .buttons .button.off").click(e => {
setColorfulMode(false);
showNotification('Colorful mode off', 1000);
setSettingsButton('colorfulMode', config.colorfulMode);
})
//tags

17
public/js/userconfig.js
View file

@ -21,7 +21,8 @@ let defaultConfig = {
layout:"default",
showDiscordDot: true,
maxConfidence: false,
timerStyle: "bar"
timerStyle: "bar",
colorfulMode: true
}
let config = defaultConfig;
@ -81,7 +82,7 @@ function loadConfigFromCookie() {
setQuickEnd(newConfig.quickEnd,true);
setFlipTestColors(newConfig.flipTestColors,true);
setDiscordDot(newConfig.hideDiscordDot,true);
setExtraTestColor(newConfig.extraTestColor,true);
setColorfulMode(newConfig.colorfulMode,true);
setMaxConfidence(newConfig.maxConfidence,true);
setTimerStyle(newConfig.timerStyle,true);
if(newConfig.resultFilters == null || newConfig.resultFilters == undefined){
@ -209,18 +210,18 @@ function toggleFlipTestColors(){
}
//extra color
function setExtraTestColor(extra,nosave){
function setColorfulMode(extra,nosave){
if(extra == undefined){
extra = false;
}
config.extraTestColor = extra;
applyExtraTestColor(extra);
config.colorfulMode = extra;
applyColorfulMode(extra);
if(!nosave) saveConfigToCookie();
}
function toggleExtraTestColor(){
config.extraTestColor = !config.extraTestColor;
applyExtraTestColor(config.extraTestColor);
function toggleColorfulMode(){
config.colorfulMode = !config.colorfulMode;
applyColorfulMode(config.colorfulMode);
saveConfigToCookie();
}

4
public/themes/8008.css
View file

@ -6,6 +6,6 @@
--text-color: #e9ecf0;
--error-color: #da3333;
--error-extra-color: #791717;
--extra-error-color: #c5da33;
--extra-error-extra-color: #849224;
--colorful-error-color: #c5da33;
--colorful-error-extra-color: #849224;
}

8
public/themes/9009.css
View file

@ -5,9 +5,9 @@
--sub-color: #99947f;
--text-color: #080909;
--error-color: #c87e74;
--extra-error-color: #a56961;
--extra-error-color: #c87e74;
--extra-error-extra-color: #a56961;
--colorful-error-color: #a56961;
--colorful-error-color: #c87e74;
--colorful-error-extra-color: #a56961;
}
.word letter.incorrect{
@ -15,7 +15,7 @@
}
.word letter.incorrect.extra{
color: var(--extra-error-color);
color: var(--colorful-error-color);
}
.word.error{

4
public/themes/bingsu.css
View file

@ -7,8 +7,8 @@
--text-color: #ebe6ea;
--error-color: #921341;
--error-extra-color: #640b2c;
--extra-error-color: #921341;
--extra-error-extra-color: #640b2c;
--colorful-error-color: #921341;
--colorful-error-extra-color: #640b2c;
}
/* .word.error{

4
public/themes/bliss.css
View file

@ -6,6 +6,6 @@
--text-color: #fff;
--error-color: #bd4141;
--error-extra-color: #883434;
--extra-error-color: #bd4141;
--extra-error-extra-color: #883434;
--colorful-error-color: #bd4141;
--colorful-error-extra-color: #883434;
}

4
public/themes/botanical.css
View file

@ -6,6 +6,6 @@
--text-color: #eaf1f3;
--error-color: #f6c9b4;
--error-extra-color: #f59a71;
--extra-error-color: #f6c9b4;
--extra-error-extra-color: #f59a71;
--colorful-error-color: #f6c9b4;
--colorful-error-extra-color: #f59a71;
}

4
public/themes/bushido.css
View file

@ -6,6 +6,6 @@
--text-color: #f6f0e9;
--error-color: #ec4c56;
--error-extra-color: #9b333a;
--extra-error-color: #ecdc4c;
--extra-error-extra-color: #bdb03d;
--colorful-error-color: #ecdc4c;
--colorful-error-extra-color: #bdb03d;
}

4
public/themes/camping.css
View file

@ -6,8 +6,8 @@
--text-color: #3c403b;
--error-color: #ad4f4e;
--error-extra-color: #7e3a39;
--extra-error-color: #ad4f4e;
--extra-error-extra-color: #7e3a39;
--colorful-error-color: #ad4f4e;
--colorful-error-extra-color: #7e3a39;
}

6
public/themes/carbon.css
View file

@ -5,7 +5,7 @@
--sub-color: #616161;
--text-color: #f5e6c8;
--error-color: #e72d2d;
--extra-error-color: #b62828;
--extra-error-color: #a5e72d;
--extra-error-extra-color: #74a120;
--colorful-error-color: #b62828;
--colorful-error-color: #a5e72d;
--colorful-error-extra-color: #74a120;
}

4
public/themes/dark.css
View file

@ -6,6 +6,6 @@
--text-color: #eee;
--error-color: #da3333;
--error-extra-color: #791717;
--extra-error-color: #da3333;
--extra-error-extra-color: #791717;
--colorful-error-color: #da3333;
--colorful-error-extra-color: #791717;
}

4
public/themes/dots.css
View file

@ -6,8 +6,8 @@
--text-color: #fff;
--error-color: #da3333;
--error-extra-color: #791717;
--extra-error-color: #da3333;
--extra-error-extra-color: #791717;
--colorful-error-color: #da3333;
--colorful-error-extra-color: #791717;
}
#menu{

4
public/themes/dracula.css
View file

@ -6,8 +6,8 @@
--text-color: #f2f2f2;
--error-color: #f758a0;
--error-extra-color: #732e51;
--extra-error-color: #f758a0;
--extra-error-extra-color: #732e51;
--colorful-error-color: #f758a0;
--colorful-error-extra-color: #732e51;
}

4
public/themes/gruvbox_dark.css
View file

@ -6,6 +6,6 @@
--text-color: #ebdbb2;
--error-color: #fb4934;
--error-extra-color: #cc241d;
--extra-error-color: #fb4934;
--extra-error-extra-color: #cc241d;
--colorful-error-color: #fb4934;
--colorful-error-extra-color: #cc241d;
}

4
public/themes/gruvbox_light.css
View file

@ -6,6 +6,6 @@
--text-color: #3c3836;
--error-color: #cc241d;
--error-extra-color: #9d0006;
--extra-error-color: #cc241d;
--extra-error-extra-color: #9d0006;
--colorful-error-color: #cc241d;
--colorful-error-extra-color: #9d0006;
}

4
public/themes/laser.css
View file

@ -6,6 +6,6 @@
--text-color: #dbe7e8;
--error-color: #a8d400;
--error-extra-color: #668000;
--extra-error-color: #a8d400;
--extra-error-extra-color: #668000;
--colorful-error-color: #a8d400;
--colorful-error-extra-color: #668000;
}

4
public/themes/light.css
View file

@ -6,6 +6,6 @@
--text-color: #111;
--error-color: #da3333;
--error-extra-color: #791717;
--extra-error-color: #da3333;
--extra-error-extra-color: #791717;
--colorful-error-color: #da3333;
--colorful-error-extra-color: #791717;
}

4
public/themes/matrix.css
View file

@ -6,8 +6,8 @@
--text-color: #adffa7;
--error-color: #da3333;
--error-extra-color: #791717;
--extra-error-color: #da3333;
--extra-error-extra-color: #791717;
--colorful-error-color: #da3333;
--colorful-error-extra-color: #791717;
}
#liveWpm, #timerNumber{

4
public/themes/metaverse.css
View file

@ -6,6 +6,6 @@
--text-color: #e8e8e8;
--error-color: #da3333;
--error-extra-color: #791717;
--extra-error-color: #d7da33;
--extra-error-extra-color: #737917;
--colorful-error-color: #d7da33;
--colorful-error-extra-color: #737917;
}

4
public/themes/miami.css
View file

@ -6,6 +6,6 @@
--sub-color: #94294c;
--error-color: #fff591;
--error-extra-color: #b9b269;
--extra-error-color: #fff591;
--extra-error-extra-color: #b9b269;
--colorful-error-color: #fff591;
--colorful-error-extra-color: #b9b269;
}

4
public/themes/miami_nights.css
View file

@ -6,6 +6,6 @@
--text-color: #fff;
--error-color: #fff591;
--error-extra-color: #b6af68;
--extra-error-color: #fff591;
--extra-error-extra-color: #b6af68;
--colorful-error-color: #fff591;
--colorful-error-extra-color: #b6af68;
}

4
public/themes/mint.css
View file

@ -6,6 +6,6 @@
--text-color: #edf5e1;
--error-color: #f35588;
--error-extra-color: #a3385a;
--extra-error-color: #f35588;
--extra-error-extra-color: #a3385a;
--colorful-error-color: #f35588;
--colorful-error-extra-color: #a3385a;
}

4
public/themes/mizu.css
View file

@ -6,6 +6,6 @@
--text-color: #1a2633;
--error-color: #bf616a;
--error-extra-color: #793e44;
--extra-error-color: #bf616a;
--extra-error-extra-color: #793e44;
--colorful-error-color: #bf616a;
--colorful-error-extra-color: #793e44;
}

4
public/themes/modern_dolch.css
View file

@ -6,6 +6,6 @@
--text-color: #e3e6eb;
--error-color: #d36a7b;
--error-extra-color: #994154;
--extra-error-color: #d36a7b;
--extra-error-extra-color: #994154;
--colorful-error-color: #d36a7b;
--colorful-error-extra-color: #994154;
}

4
public/themes/monokai.css
View file

@ -6,6 +6,6 @@
--text-color: #E6DB74;
--error-color: #F92672;
--error-extra-color: #FD971F;
--extra-error-color: #F92672;
--extra-error-extra-color: #FD971F;
--colorful-error-color: #F92672;
--colorful-error-extra-color: #FD971F;
}

4
public/themes/mr_sleeves.css
View file

@ -6,8 +6,8 @@
--text-color: #1d1d1d;
--error-color: #bf6464;
--error-extra-color: #793e44;
--extra-error-color: #8fadc9;
--extra-error-extra-color: #667c91;
--colorful-error-color: #8fadc9;
--colorful-error-extra-color: #667c91;
}
#top .logo .bottom{

4
public/themes/nautilus.css
View file

@ -6,6 +6,6 @@
--text-color: #1cbaac;
--error-color: #da3333;
--error-extra-color: #791717;
--extra-error-color: #da3333;
--extra-error-extra-color: #791717;
--colorful-error-color: #da3333;
--colorful-error-extra-color: #791717;
}

4
public/themes/nord.css
View file

@ -6,6 +6,6 @@
--text-color: #d8dee9;
--error-color: #bf616a;
--error-extra-color: #793e44;
--extra-error-color: #bf616a;
--extra-error-extra-color: #793e44;
--colorful-error-color: #bf616a;
--colorful-error-extra-color: #793e44;
}

4
public/themes/oblivion.css
View file

@ -6,8 +6,8 @@
--text-color: #f7f5f1;
--error-color: #dd452e;
--error-extra-color: #9e3423;
--extra-error-color: #dd452e;
--extra-error-extra-color: #9e3423;
--colorful-error-color: #dd452e;
--colorful-error-extra-color: #9e3423;
}
#menu .button:nth-child(1){

4
public/themes/olive.css
View file

@ -6,6 +6,6 @@
--text-color: #373731;
--error-color: #cf2f2f;
--error-extra-color: #a22929;
--extra-error-color: #cf2f2f;
--extra-error-extra-color: #a22929;
--colorful-error-color: #cf2f2f;
--colorful-error-extra-color: #a22929;
}

4
public/themes/olivia.css
View file

@ -6,6 +6,6 @@
--text-color:#f2efed;
--error-color: #bf616a;
--error-extra-color: #793e44;
--extra-error-color: #e03d4e;
--extra-error-extra-color: #aa2f3b;
--colorful-error-color: #e03d4e;
--colorful-error-extra-color: #aa2f3b;
}

4
public/themes/pulse.css
View file

@ -6,6 +6,6 @@
--text-color: #e5f4f4;
--error-color: #da3333;
--error-extra-color: #791717;
--extra-error-color: #da3333;
--extra-error-extra-color: #791717;
--colorful-error-color: #da3333;
--colorful-error-extra-color: #791717;
}

4
public/themes/red_samurai.css
View file

@ -6,6 +6,6 @@
--text-color: #e2dad0;
--error-color: #33bbda;
--error-extra-color: #176b79;
--extra-error-color: #33bbda;
--extra-error-extra-color: #176779;
--colorful-error-color: #33bbda;
--colorful-error-extra-color: #176779;
}

4
public/themes/retro.css
View file

@ -6,6 +6,6 @@
--text-color: #1d1b17;
--error-color: #bf616a;
--error-extra-color: #793e44;
--extra-error-color: #bf616a;
--extra-error-extra-color: #793e44;
--colorful-error-color: #bf616a;
--colorful-error-extra-color: #793e44;
}

4
public/themes/rgb.css
View file

@ -6,8 +6,8 @@
--text-color: #eee;
--error-color: #eee;
--error-extra-color: #b3b3b3;
--extra-error-color: #eee;
--extra-error-extra-color: #b3b3b3;
--colorful-error-color: #eee;
--colorful-error-extra-color: #b3b3b3;
}
@keyframes rgb{

4
public/themes/serika.css
View file

@ -6,6 +6,6 @@
--text-color:#323437;
--error-color: #da3333;
--error-extra-color: #791717;
--extra-error-color: #da3333;
--extra-error-extra-color: #791717;
--colorful-error-color: #da3333;
--colorful-error-extra-color: #791717;
}

4
public/themes/serika_dark.css
View file

@ -6,6 +6,6 @@
--text-color: #d1d0c5;
--error-color: #ca4754;
--error-extra-color: #7e2a33;
--extra-error-color: #ca4754;
--extra-error-extra-color: #7e2a33;
--colorful-error-color: #ca4754;
--colorful-error-extra-color: #7e2a33;
}

4
public/themes/shadow.css
View file

@ -6,8 +6,8 @@
--text-color: #eee;
--error-color: #fff;
--error-extra-color: #d8d8d8;
--extra-error-color: #fff;
--extra-error-extra-color: #d8d8d8;
--colorful-error-color: #fff;
--colorful-error-extra-color: #d8d8d8;
}
@keyframes shadow {

4
public/themes/strawberry.css
View file

@ -6,6 +6,6 @@
--text-color: #fcfcf8;
--error-color: #fcd23f;
--error-extra-color: #d7ae1e;
--extra-error-color: #fcd23f;
--extra-error-extra-color: #d7ae1e;
--colorful-error-color: #fcd23f;
--colorful-error-extra-color: #d7ae1e;
}

4
public/themes/striker.css
View file

@ -6,6 +6,6 @@
--text-color: #d6dbd9;
--error-color: #fb4934;
--error-extra-color: #cc241d;
--extra-error-color: #fb4934;
--extra-error-extra-color: #cc241d;
--colorful-error-color: #fb4934;
--colorful-error-extra-color: #cc241d;
}

4
public/themes/taro.css
View file

@ -7,8 +7,8 @@
--text-color: #130f1a;
--error-color: #ffe23e;
--error-extra-color: #fff1c3;
--extra-error-color: #ffe23e;
--extra-error-extra-color: #fff1c3;
--colorful-error-color: #ffe23e;
--colorful-error-extra-color: #fff1c3;
}
.word.error{

4
public/themes/terminal.css
View file

@ -6,6 +6,6 @@
--text-color: #e7eae0;
--error-color: #a61717;
--error-extra-color: #731010;
--extra-error-color: #a61717;
--extra-error-extra-color: #731010;
--colorful-error-color: #a61717;
--colorful-error-extra-color: #731010;
}

4
public/themes/vaporwave.css
View file

@ -6,6 +6,6 @@
--text-color: #f1ebf1;
--error-color: #573ca9;
--error-extra-color: #3d2b77;
--extra-error-color: #28cafe;
--extra-error-extra-color: #25a9ce;
--colorful-error-color: #28cafe;
--colorful-error-extra-color: #25a9ce;
}

4
public/themes/voc.css
View file

@ -6,6 +6,6 @@
--text-color: #eeeae4;
--error-color: #af3735;
--error-extra-color: #7e2a29;
--extra-error-color: #af3735;
--extra-error-extra-color: #7e2a29;
--colorful-error-color: #af3735;
--colorful-error-extra-color: #7e2a29;
}