updated logo

This commit is contained in:
Miodec 2021-08-26 14:27:51 +01:00
parent 71123d4e55
commit e11a124212
4 changed files with 125 additions and 56 deletions

View file

@ -6,6 +6,8 @@ import Config from "./config";
import * as UI from "./ui";
import tinycolor from "tinycolor2";
const domtoimage = require("dom-to-image");
let isPreviewingTheme = false;
export let randomTheme = null;
@ -22,38 +24,17 @@ export const colorVars = [
];
async function updateFavicon(size, curveSize) {
let maincolor, bgcolor;
bgcolor = await ThemeColors.get("bg");
maincolor = await ThemeColors.get("main");
if (bgcolor == maincolor) {
bgcolor = "#111";
maincolor = "#eee";
}
var canvas = document.createElement("canvas");
canvas.width = size;
canvas.height = size;
let ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.moveTo(0, curveSize);
//top left
ctx.quadraticCurveTo(0, 0, curveSize, 0);
ctx.lineTo(size - curveSize, 0);
//top right
ctx.quadraticCurveTo(size, 0, size, curveSize);
ctx.lineTo(size, size - curveSize);
ctx.quadraticCurveTo(size, size, size - curveSize, size);
ctx.lineTo(curveSize, size);
ctx.quadraticCurveTo(0, size, 0, size - curveSize);
ctx.fillStyle = bgcolor;
ctx.fill();
ctx.font = "900 " + (size / 2) * 1.2 + "px Roboto Mono";
ctx.textAlign = "center";
ctx.fillStyle = maincolor;
ctx.fillText("mt", size / 2 + size / 32, (size / 3) * 2.1);
$("#favicon").attr("href", canvas.toDataURL("image/png"));
setTimeout(() => {
console.log("fav");
domtoimage
.toPng(document.querySelector(".logo .icon"))
.then(function (dataUrl) {
// console.log(dataUrl);
// ctx.drawImage(dataUrl, 0, 0);
// $('body').prepend(canvas);
$("#favicon").attr("href", dataUrl);
});
}, 125);
}
function clearCustomTheme() {
@ -78,7 +59,7 @@ let loadStyle = function (name) {
});
};
export function apply(themeName) {
export function apply(themeName, isPreview = false) {
clearCustomTheme();
let name = "serika_dark";
@ -121,18 +102,20 @@ export function apply(themeName) {
} catch (e) {
console.log("Analytics unavailable");
}
ThemeColors.get().then((colors) => {
$(".keymap-key").attr("style", "");
ChartController.updateAllChartColors();
updateFavicon(32, 14);
$("#metaThemeColor").attr("content", colors.bg);
});
if (!isPreview) {
ThemeColors.get().then((colors) => {
$(".keymap-key").attr("style", "");
ChartController.updateAllChartColors();
updateFavicon(128, 32);
$("#metaThemeColor").attr("content", colors.bg);
});
}
});
}
export function preview(themeName) {
isPreviewingTheme = true;
apply(themeName);
apply(themeName, true);
}
export function set(themeName) {

View file

@ -8,6 +8,8 @@
@import url("https://fonts.googleapis.com/css2?family=Comfortaa&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Coming+Soon&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Lato&display=swap");
:root {
--roundness: 0.25rem;
--font: "Roboto Mono";
@ -1661,7 +1663,7 @@ label.checkbox {
line-height: 2.3rem;
font-size: 2.3rem;
/* text-align: center; */
transition: 0.25s;
// transition: 0.25s;
padding: 0 5px;
display: grid;
grid-auto-flow: column;
@ -1672,18 +1674,41 @@ label.checkbox {
user-select: none;
.logo {
margin-bottom: 0.6rem;
// margin-bottom: 0.6rem;
display: grid;
grid-template-columns: auto 1fr;
gap: 0.5rem;
.icon {
width: 2.5rem;
display: grid;
align-items: center;
background-color: transparent;
// margin-bottom: 0.15rem;
svg path {
transition: 0.25s;
fill: var(--main-color);
}
}
.text {
.top {
position: absolute;
left: 0.25rem;
top: -0.1rem;
font-size: 0.65rem;
line-height: 0.65rem;
color: var(--sub-color);
transition: 0.25s;
}
position: relative;
font-size: 2rem;
margin-bottom: 0.4rem;
font-family: "Lexend Deca";
transition: 0.25s;
}
white-space: nowrap;
user-select: none;
.top {
font-size: 0.65rem;
line-height: 0.65rem;
margin-bottom: -0.4rem;
margin-left: -0.1rem;
color: var(--sub-color);
}
.bottom {
margin-left: -0.15rem;
color: var(--main-color);
@ -1769,8 +1794,17 @@ label.checkbox {
opacity: 0 !important;
}
.logo .bottom {
.icon svg path {
fill: var(--sub-color) !important;
}
.logo .text {
color: var(--sub-color) !important;
// opacity: 0 !important;
}
.logo .top {
opacity: 0 !important;
}
.config {

BIN
static/images/fav.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

View file

@ -15,7 +15,7 @@
<link rel="stylesheet" href="themes/serika_dark.css" id="currentTheme" />
<link rel="stylesheet" href="" id="funBoxTheme" />
<link id="favicon" rel="shortcut icon" href="images/fav.png" />
<link rel="shortcut icon" href="images/favicon/fav.png" />
<!-- <link rel="shortcut icon" href="images/favicon/fav.png" /> -->
<link
href="images/favicon/apple-touch-icon-180x180.png"
rel="apple-touch-icon"
@ -954,9 +954,62 @@
<div style="display: flex; justify-content: space-around">
<div id="centerContent" class="hidden">
<div id="top">
<div class="logo">
<!-- <div class="logo">
<div class="top">monkey see</div>
<div class="bottom">monkeytype</div>
</div> -->
<div class="logo">
<div class="icon">
<!-- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="isolation:isolate" viewBox="-621 -935 270 160" ><g><path d="M -401 -835 L -401 -835 C -395.481 -835 -391 -830.519 -391 -825 L -391 -825 C -391 -819.481 -395.481 -815 -401 -815 L -401 -815 C -406.519 -815 -411 -819.481 -411 -825 L -411 -825 C -411 -830.519 -406.519 -835 -401 -835 Z" /><path d="M -571 -835 L -561 -835 C -555.481 -835 -551 -830.519 -551 -825 L -551 -825 C -551 -819.481 -555.481 -815 -561 -815 L -571 -815 C -576.519 -815 -581 -819.481 -581 -825 L -581 -825 C -581 -830.519 -576.519 -835 -571 -835 Z" /><path d="M -531 -835 L -461 -835 C -455.481 -835 -451 -830.519 -451 -825 L -451 -825 C -451 -819.481 -455.481 -815 -461 -815 L -531 -815 C -536.519 -815 -541 -819.481 -541 -825 L -541 -825 C -541 -830.519 -536.519 -835 -531 -835 Z" /><path d="M -431 -865 L -431 -865 C -425.481 -865 -421 -860.519 -421 -855 L -421 -825 C -421 -819.481 -425.481 -815 -431 -815 L -431 -815 C -436.519 -815 -441 -819.481 -441 -825 L -441 -855 C -441 -860.519 -436.519 -865 -431 -865 Z" /><path d="M -461 -865 L -401 -865 C -395.481 -865 -391 -860.519 -391 -855 L -391 -855 C -391 -849.481 -395.481 -845 -401 -845 L -461 -845 C -466.519 -845 -471 -849.481 -471 -855 L -471 -855 C -471 -860.519 -466.519 -865 -461 -865 Z" /><path d="M -431 -895 L -401 -895 C -395.481 -895 -391 -890.519 -391 -885 L -391 -885 C -391 -879.481 -395.481 -875 -401 -875 L -431 -875 C -436.519 -875 -441 -879.481 -441 -885 L -441 -885 C -441 -890.519 -436.519 -895 -431 -895 Z" /><path d="M -465 -895 L -461 -895 C -455.481 -895 -451 -890.519 -451 -885 L -451 -885 C -451 -879.481 -455.481 -875 -461 -875 L -465 -875 C -470.519 -875 -475 -879.481 -475 -885 L -475 -885 C -475 -890.519 -470.519 -895 -465 -895 Z" /><path d=" M -501 -865 L -481 -865 L -481 -855 C -481 -849.481 -485.481 -845 -491 -845 L -491 -845 C -496.519 -845 -501 -849.481 -501 -855 L -501 -865 Z "/><path d=" M -541 -865 L -521 -865 L -521 -855 C -521 -849.481 -525.481 -845 -531 -845 L -531 -845 C -536.519 -845 -541 -849.481 -541 -855 L -541 -865 Z "/><path d=" M -581 -865 L -561 -865 L -561 -855 C -561 -849.481 -565.481 -845 -571 -845 L -571 -845 C -576.519 -845 -581 -849.481 -581 -855 L -581 -865 Z "/><path d=" M -501 -865 L -501 -865 C -501 -870.519 -505.481 -875 -511 -875 L -511 -875 L -511 -895 L -511 -895 C -494.443 -895 -481 -881.557 -481 -865 L -481 -865 L -501 -865 Z "/><path d=" M -541 -865 L -541 -865 C -541 -870.519 -545.481 -875 -551 -875 L -551 -875 L -551 -895 L -551 -895 C -534.443 -895 -521 -881.557 -521 -865 L -521 -865 L -541 -865 Z "/><path d=" M -511 -875 L -511 -875 C -516.519 -875 -521 -870.519 -521 -865 L -521 -865 L -541 -865 L -541 -865 C -541 -881.557 -527.557 -895 -511 -895 L -511 -895 L -511 -875 Z "/><path d=" M -551 -875 L -551 -875 C -556.519 -875 -561 -870.519 -561 -865 L -561 -865 L -581 -865 L -581 -865 C -581 -881.557 -567.557 -895 -551 -895 L -551 -895 L -551 -875 Z "/><path d=" M -601 -845 L -621 -845 L -621 -885 C -621 -912.596 -598.596 -935 -571 -935 L -401 -935 C -373.404 -935 -351 -912.596 -351 -885 L -351 -825 C -351 -797.404 -373.404 -775 -401 -775 L -571 -775 C -598.596 -775 -621 -797.404 -621 -825 L -621 -845 L -601 -845 L -601 -825 C -601 -808.443 -587.557 -795 -571 -795 L -401 -795 C -384.443 -795 -371 -808.443 -371 -825 L -371 -885 C -371 -901.557 -384.443 -915 -401 -915 L -571 -915 C -587.557 -915 -601 -901.557 -601 -885 L -601 -845 Z "/></g></svg> -->
<!-- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="isolation:isolate" viewBox="-600 -930 250 160"><g><path d="M -400 -830 L -400 -830 C -394.481 -830 -390 -825.519 -390 -820 L -390 -820 C -390 -814.481 -394.481 -810 -400 -810 L -400 -810 C -405.519 -810 -410 -814.481 -410 -820 L -410 -820 C -410 -825.519 -405.519 -830 -400 -830 Z"/><path d=" M -505 -830 L -460 -830 C -454.481 -830 -450 -825.519 -450 -820 L -450 -820 C -450 -814.481 -454.481 -810 -460 -810 L -505 -810 C -510.519 -810 -515 -814.481 -515 -820 L -515 -820 C -515 -825.519 -510.519 -830 -505 -830 Z "/><path d="M -430 -860 L -430 -860 C -424.481 -860 -420 -855.519 -420 -850 L -420 -820 C -420 -814.481 -424.481 -810 -430 -810 L -430 -810 C -435.519 -810 -440 -814.481 -440 -820 L -440 -850 C -440 -855.519 -435.519 -860 -430 -860 Z"/><path d="M -460 -860 L -400 -860 C -394.481 -860 -390 -855.519 -390 -850 L -390 -850 C -390 -844.481 -394.481 -840 -400 -840 L -460 -840 C -465.519 -840 -470 -844.481 -470 -850 L -470 -850 C -470 -855.519 -465.519 -860 -460 -860 Z"/><path d="M -430 -890 L -400 -890 C -394.481 -890 -390 -885.519 -390 -880 L -390 -880 C -390 -874.481 -394.481 -870 -400 -870 L -430 -870 C -435.519 -870 -440 -874.481 -440 -880 L -440 -880 C -440 -885.519 -435.519 -890 -430 -890 Z"/><path d=" M -550 -830 L -535 -830 C -529.481 -830 -525 -825.519 -525 -820 L -525 -820 C -525 -814.481 -529.481 -810 -535 -810 L -550 -810 C -555.519 -810 -560 -814.481 -560 -820 L -560 -820 C -560 -825.519 -555.519 -830 -550 -830 Z "/><path d="M -464 -890 L -460 -890 C -454.481 -890 -450 -885.519 -450 -880 L -450 -880 C -450 -874.481 -454.481 -870 -460 -870 L -464 -870 C -469.519 -870 -474 -874.481 -474 -880 L -474 -880 C -474 -885.519 -469.519 -890 -464 -890 Z"/><path d=" M -500 -860 L -480 -860 L -480 -850 C -480 -844.481 -484.481 -840 -490 -840 L -490 -840 C -495.519 -840 -500 -844.481 -500 -850 L -500 -860 Z "/><path d=" M -530 -860 L -510 -860 L -510 -850 C -510 -844.481 -514.481 -840 -520 -840 L -520 -840 C -525.519 -840 -530 -844.481 -530 -850 L -530 -860 Z "/><path d=" M -560 -860 L -540 -860 L -540 -850 C -540 -844.481 -544.481 -840 -550 -840 L -550 -840 C -555.519 -840 -560 -844.481 -560 -850 L -560 -860 Z "/><path d=" M -500 -860 L -500 -865 C -500 -867.76 -502.24 -870 -505 -870 L -505 -870 L -505 -890 L -505 -890 C -491.202 -890 -480 -878.798 -480 -865 L -480 -860 L -500 -860 Z "/><path d=" M -530 -860 L -530 -865 C -530 -867.76 -532.24 -870 -535 -870 L -535 -870 L -535 -890 L -535 -890 C -521.202 -890 -510 -878.798 -510 -865 L -510 -860 L -530 -860 Z "/><path d=" M -510 -860 L -510 -865 C -510 -867.76 -507.76 -870 -505 -870 L -505 -870 L -505 -890 L -505 -890 C -518.798 -890 -530 -878.798 -530 -865 L -530 -860 L -510 -860 Z "/><path d=" M -540 -860 L -540 -865 C -540 -867.76 -537.76 -870 -535 -870 L -535 -870 L -535 -890 L -535 -890 C -548.798 -890 -560 -878.798 -560 -865 L -560 -860 L -540 -860 Z "/><path d=" M -580 -840 L -600 -840 L -600 -880 C -600 -907.596 -577.596 -930 -550 -930 L -400 -930 C -372.404 -930 -350 -907.596 -350 -880 L -350 -820 C -350 -792.404 -372.404 -770 -400 -770 L -550 -770 C -577.596 -770 -600 -792.404 -600 -820 L -600 -840 L -580 -840 L -580 -820 C -580 -803.443 -566.557 -790 -550 -790 L -400 -790 C -383.443 -790 -370 -803.443 -370 -820 L -370 -880 C -370 -896.557 -383.443 -910 -400 -910 L -550 -910 C -566.557 -910 -580 -896.557 -580 -880 L -580 -840 Z "/></g></svg> -->
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
style="isolation: isolate"
viewBox="-680 -1030 300 180"
>
<g>
<path
d="M -430 -910 L -430 -910 C -424.481 -910 -420 -905.519 -420 -900 L -420 -900 C -420 -894.481 -424.481 -890 -430 -890 L -430 -890 C -435.519 -890 -440 -894.481 -440 -900 L -440 -900 C -440 -905.519 -435.519 -910 -430 -910 Z"
/>
<path
d=" M -570 -910 L -510 -910 C -504.481 -910 -500 -905.519 -500 -900 L -500 -900 C -500 -894.481 -504.481 -890 -510 -890 L -570 -890 C -575.519 -890 -580 -894.481 -580 -900 L -580 -900 C -580 -905.519 -575.519 -910 -570 -910 Z "
/>
<path
d="M -590 -970 L -590 -970 C -584.481 -970 -580 -965.519 -580 -960 L -580 -940 C -580 -934.481 -584.481 -930 -590 -930 L -590 -930 C -595.519 -930 -600 -934.481 -600 -940 L -600 -960 C -600 -965.519 -595.519 -970 -590 -970 Z"
/>
<path
d=" M -639.991 -960.515 C -639.72 -976.836 -626.385 -990 -610 -990 L -610 -990 C -602.32 -990 -595.31 -987.108 -590 -982.355 C -584.69 -987.108 -577.68 -990 -570 -990 L -570 -990 C -553.615 -990 -540.28 -976.836 -540.009 -960.515 C -540.001 -960.345 -540 -960.172 -540 -960 L -540 -960 L -540 -940 C -540 -934.481 -544.481 -930 -550 -930 L -550 -930 C -555.519 -930 -560 -934.481 -560 -940 L -560 -960 L -560 -960 C -560 -965.519 -564.481 -970 -570 -970 C -575.519 -970 -580 -965.519 -580 -960 L -580 -960 L -580 -960 L -580 -940 C -580 -934.481 -584.481 -930 -590 -930 L -590 -930 C -595.519 -930 -600 -934.481 -600 -940 L -600 -960 L -600 -960 L -600 -960 L -600 -960 L -600 -960 L -600 -960 L -600 -960 L -600 -960 C -600 -965.519 -604.481 -970 -610 -970 C -615.519 -970 -620 -965.519 -620 -960 L -620 -960 L -620 -940 C -620 -934.481 -624.481 -930 -630 -930 L -630 -930 C -635.519 -930 -640 -934.481 -640 -940 L -640 -960 L -640 -960 C -640 -960.172 -639.996 -960.344 -639.991 -960.515 Z "
/>
<path
d=" M -460 -930 L -460 -900 C -460 -894.481 -464.481 -890 -470 -890 L -470 -890 C -475.519 -890 -480 -894.481 -480 -900 L -480 -930 L -508.82 -930 C -514.99 -930 -520 -934.481 -520 -940 L -520 -940 C -520 -945.519 -514.99 -950 -508.82 -950 L -431.18 -950 C -425.01 -950 -420 -945.519 -420 -940 L -420 -940 C -420 -934.481 -425.01 -930 -431.18 -930 L -460 -930 Z "
/>
<path
d="M -470 -990 L -430 -990 C -424.481 -990 -420 -985.519 -420 -980 L -420 -980 C -420 -974.481 -424.481 -970 -430 -970 L -470 -970 C -475.519 -970 -480 -974.481 -480 -980 L -480 -980 C -480 -985.519 -475.519 -990 -470 -990 Z"
/>
<path
d=" M -630 -910 L -610 -910 C -604.481 -910 -600 -905.519 -600 -900 L -600 -900 C -600 -894.481 -604.481 -890 -610 -890 L -630 -890 C -635.519 -890 -640 -894.481 -640 -900 L -640 -900 C -640 -905.519 -635.519 -910 -630 -910 Z "
/>
<path
d=" M -515 -990 L -510 -990 C -504.481 -990 -500 -985.519 -500 -980 L -500 -980 C -500 -974.481 -504.481 -970 -510 -970 L -515 -970 C -520.519 -970 -525 -974.481 -525 -980 L -525 -980 C -525 -985.519 -520.519 -990 -515 -990 Z "
/>
<path
d=" M -660 -910 L -680 -910 L -680 -980 C -680 -1007.596 -657.596 -1030 -630 -1030 L -430 -1030 C -402.404 -1030 -380 -1007.596 -380 -980 L -380 -900 C -380 -872.404 -402.404 -850 -430 -850 L -630 -850 C -657.596 -850 -680 -872.404 -680 -900 L -680 -920 L -660 -920 L -660 -900 C -660 -883.443 -646.557 -870 -630 -870 L -430 -870 C -413.443 -870 -400 -883.443 -400 -900 L -400 -980 C -400 -996.557 -413.443 -1010 -430 -1010 L -630 -1010 C -646.557 -1010 -660 -996.557 -660 -980 L -660 -910 Z "
/>
</g>
</svg>
<!-- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="isolation:isolate" viewBox="-140 -910 220 100"><g><path d=" M -60 -880 L -60 -880 C -60 -885.519 -64.481 -890 -70 -890 L -70 -890 L -70 -910 L -70 -910 C -53.443 -910 -40 -896.557 -40 -880 L -40 -880 L -60 -880 Z " fill="rgb(0,0,0)"/><path d=" M -100 -880 L -100 -880 C -100 -885.519 -104.481 -890 -110 -890 L -110 -890 L -110 -910 L -110 -910 C -93.443 -910 -80 -896.557 -80 -880 L -80 -880 L -100 -880 Z " fill="rgb(0,0,0)"/><path d=" M -80 -880 L -80 -880 C -80 -885.519 -75.519 -890 -70 -890 L -70 -890 L -70 -910 L -70 -910 C -86.557 -910 -100 -896.557 -100 -880 L -100 -880 L -80 -880 Z " fill="rgb(0,0,0)"/><path d=" M -120 -880 L -120 -880 C -120 -885.519 -115.519 -890 -110 -890 L -110 -890 L -110 -910 L -110 -910 C -126.557 -910 -140 -896.557 -140 -880 L -140 -880 L -120 -880 Z " fill="rgb(0,0,0)"/><path d="M 70 -830 L 70 -830 C 75.519 -830 80 -825.519 80 -820 L 80 -820 C 80 -814.481 75.519 -810 70 -810 L 70 -810 C 64.481 -810 60 -814.481 60 -820 L 60 -820 C 60 -825.519 64.481 -830 70 -830 Z"/><path d=" M -70 -830 L -10 -830 C -4.481 -830 0 -825.519 0 -820 L 0 -820 C 0 -814.481 -4.481 -810 -10 -810 L -70 -810 C -75.519 -810 -80 -814.481 -80 -820 L -80 -820 C -80 -825.519 -75.519 -830 -70 -830 Z " fill="rgb(0,0,0)"/><path d="M 30 -860 L 30 -860 C 35.519 -860 40 -855.519 40 -850 L 40 -820 C 40 -814.481 35.519 -810 30 -810 L 30 -810 C 24.481 -810 20 -814.481 20 -820 L 20 -850 C 20 -855.519 24.481 -860 30 -860 Z"/><path d="M -50 -890 L -50 -890 C -44.481 -890 -40 -885.519 -40 -880 L -40 -860 C -40 -854.481 -44.481 -850 -50 -850 L -50 -850 C -55.519 -850 -60 -854.481 -60 -860 L -60 -880 C -60 -885.519 -55.519 -890 -50 -890 Z"/><path d="M -90 -890 L -90 -890 C -84.481 -890 -80 -885.519 -80 -880 L -80 -860 C -80 -854.481 -84.481 -850 -90 -850 L -90 -850 C -95.519 -850 -100 -854.481 -100 -860 L -100 -880 C -100 -885.519 -95.519 -890 -90 -890 Z"/><path d="M -90 -890 L -90 -890 C -95.519 -890 -100 -885.519 -100 -880 L -100 -860 C -100 -854.481 -95.519 -850 -90 -850 L -90 -850 C -84.481 -850 -80 -854.481 -80 -860 L -80 -880 C -80 -885.519 -84.481 -890 -90 -890 Z"/><path d="M -130 -890 L -130 -890 C -135.519 -890 -140 -885.519 -140 -880 L -140 -860 C -140 -854.481 -135.519 -850 -130 -850 L -130 -850 C -124.481 -850 -120 -854.481 -120 -860 L -120 -880 C -120 -885.519 -124.481 -890 -130 -890 Z"/><path d="M -8.82 -870 L 68.82 -870 C 74.99 -870 80 -865.519 80 -860 L 80 -860 C 80 -854.481 74.99 -850 68.82 -850 L -8.82 -850 C -14.99 -850 -20 -854.481 -20 -860 L -20 -860 C -20 -865.519 -14.99 -870 -8.82 -870 Z"/><path d="M 30 -910 L 70 -910 C 75.519 -910 80 -905.519 80 -900 L 80 -900 C 80 -894.481 75.519 -890 70 -890 L 30 -890 C 24.481 -890 20 -894.481 20 -900 L 20 -900 C 20 -905.519 24.481 -910 30 -910 Z"/><path d=" M -130 -830 L -110 -830 C -104.481 -830 -100 -825.519 -100 -820 L -100 -820 C -100 -814.481 -104.481 -810 -110 -810 L -130 -810 C -135.519 -810 -140 -814.481 -140 -820 L -140 -820 C -140 -825.519 -135.519 -830 -130 -830 Z " fill="rgb(0,0,0)"/><path d="M -14 -910 L -10 -910 C -4.481 -910 0 -905.519 0 -900 L 0 -900 C 0 -894.481 -4.481 -890 -10 -890 L -14 -890 C -19.519 -890 -24 -894.481 -24 -900 L -24 -900 C -24 -905.519 -19.519 -910 -14 -910 Z"/></g></svg> -->
<!-- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="isolation:isolate" viewBox="-160 -930 260 140"><path d=" M 20 -850 L 20 -850 L 20 -820 C 20 -814.481 24.481 -810 30 -810 L 30 -810 C 35.519 -810 40 -814.481 40 -820 L 40 -850 L 40 -850 L 68.82 -850 C 74.99 -850 80 -854.481 80 -860 L 80 -860 C 80 -865.519 74.99 -870 68.82 -870 L -8.82 -870 C -14.99 -870 -20 -865.519 -20 -860 L -20 -860 C -20 -854.481 -14.99 -850 -8.82 -850 L 20 -850 L 20 -850 L 20 -850 L 20 -850 Z M -40.009 -880.515 C -40.28 -896.836 -53.615 -910 -70 -910 L -70 -910 L -70 -910 L -70 -890 L -70 -890 L -70 -890 L -70 -910 L -70 -910 C -77.68 -910 -84.69 -907.108 -90 -902.355 L -90 -902.355 C -95.31 -907.108 -102.32 -910 -110 -910 L -110 -910 C -126.385 -910 -139.72 -896.836 -139.991 -880.515 L -139.991 -880.515 C -139.996 -880.344 -140 -880.172 -140 -880 L -140 -880 L -140 -860 C -140 -854.481 -135.519 -850 -130 -850 L -130 -850 C -124.481 -850 -120 -854.481 -120 -860 L -120 -880 L -120 -880 C -120 -885.519 -115.519 -890 -110 -890 L -110 -890 L -110 -890 L -110 -890 L -110 -890 C -104.481 -890 -100 -885.519 -100 -880 L -100 -880 L -100 -880 L -100 -880 L -100 -880 L -100 -880 L -100 -880 L -100 -880 L -100 -880 L -100 -860 C -100 -854.481 -95.519 -850 -90 -850 L -90 -850 C -84.481 -850 -80 -854.481 -80 -860 L -80 -860 L -80 -880 L -80 -880 L -80 -880 L -80 -880 L -80 -880 L -80 -880 L -80 -880 C -80 -885.519 -75.519 -890 -70 -890 L -70 -890 L -70 -890 L -70 -890 L -70 -890 C -64.481 -890 -60 -885.519 -60 -880 L -60 -880 L -60 -860 C -60 -854.481 -55.519 -850 -50 -850 L -50 -850 C -44.481 -850 -40 -854.481 -40 -860 L -40 -880 L -40 -880 C -40 -880.172 -40.004 -880.344 -40.009 -880.515 L -40.009 -880.515 L -40.009 -880.515 L -40.009 -880.515 L -40.009 -880.515 Z M 70 -830 L 70 -830 C 75.519 -830 80 -825.519 80 -820 L 80 -820 C 80 -814.481 75.519 -810 70 -810 L 70 -810 C 64.481 -810 60 -814.481 60 -820 L 60 -820 C 60 -825.519 64.481 -830 70 -830 L 70 -830 L 70 -830 L 70 -830 L 70 -830 L 70 -830 L 70 -830 L 70 -830 Z M -70 -830 L -10 -830 C -4.481 -830 0 -825.519 0 -820 L 0 -820 C 0 -814.481 -4.481 -810 -10 -810 L -70 -810 C -75.519 -810 -80 -814.481 -80 -820 L -80 -820 C -80 -825.519 -75.519 -830 -70 -830 L -70 -830 L -70 -830 L -70 -830 L -70 -830 L -70 -830 L -70 -830 Z M 30 -910 L 70 -910 C 75.519 -910 80 -905.519 80 -900 L 80 -900 C 80 -894.481 75.519 -890 70 -890 L 30 -890 C 24.481 -890 20 -894.481 20 -900 L 20 -900 C 20 -905.519 24.481 -910 30 -910 L 30 -910 L 30 -910 Z M -130 -830 L -110 -830 C -104.481 -830 -100 -825.519 -100 -820 L -100 -820 C -100 -814.481 -104.481 -810 -110 -810 L -130 -810 C -135.519 -810 -140 -814.481 -140 -820 L -140 -820 C -140 -825.519 -135.519 -830 -130 -830 L -130 -830 Z M -131.156 -930 L 71.156 -930 C 87.075 -930 100 -917.075 100 -901.156 L 100 -818.844 C 100 -802.925 87.075 -790 71.156 -790 L -131.156 -790 C -147.075 -790 -160 -802.925 -160 -818.844 L -160 -901.156 C -160 -917.075 -147.075 -930 -131.156 -930 L -131.156 -930 L -131.156 -930 L -131.156 -930 L -131.156 -930 L -131.156 -930 L -131.156 -930 L -131.156 -930 L -131.156 -930 L -131.156 -930 L -131.156 -930 L -131.156 -930 L -131.156 -930 L -131.156 -930 L -131.156 -930 Z M -15 -910 L -10 -910 C -4.481 -910 0 -905.519 0 -900 L 0 -900 C 0 -894.481 -4.481 -890 -10 -890 L -15 -890 C -20.519 -890 -25 -894.481 -25 -900 L -25 -900 C -25 -905.519 -20.519 -910 -15 -910 Z " fill-rule="evenodd"/></svg> -->
</div>
<div class="text">
<div class="top">monkey see</div>
monkeytype
</div>
<!-- <image fill="red" xlink:href="images/logo1.svg" width="96" height="96"/> -->
<!-- <svg>
<use src="images/logo1.svg" style="--color_fill: #000;"></use>
</svg> -->
<!-- <img src="images/logo1.svg" alt="" width="200px" height="100px"> -->
</div>
<div id="menu">
<div
@ -1617,9 +1670,8 @@
<key>enter</key>
(or just
<key>tab</key>
if you have
<a href="settings">quick tab mode enabled</a>
) to restart the typing test. Open the command line by pressing
if you have quick tab mode enabled ) to restart the typing test.
Open the command line by pressing
<key>esc</key>
- there you can access all the functionality you need without
touching your mouse