monkeytypegame/monkeytype
1
1
Fork 0
mirror of https://github.com/monkeytypegame/monkeytype.git synced 2025-10-19 03:56:17 +08:00
Code Issues Projects Releases Packages Wiki Activity

style: rework keymap looks to use background instead of border

Browse source
This commit is contained in:
Miodec 2023-09-19 14:14:24 +01:00
parent 5adee78cb8
commit 49a1b41b17
2 changed files with 9 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
frontend/src/styles/keymap.scss
View file

@ -16,11 +16,11 @@
.keymapKey {
display: flex;
background-color: transparent;
background-color: var(--sub-alt-color);
color: var(--sub-color);
border-radius: var(--roundness);
border: 0.05rem solid;
border-color: var(--sub-color);
// border: 0.05rem solid;
// border-color: var(--sub-color);
text-align: center;
justify-content: center;
align-items: center;
@ -29,13 +29,13 @@
position: relative;
.bump {
width: 0.75rem;
height: 0.05rem;
background: var(--sub-color);
width: 0.5em;
height: 0.1em;
background: var(--bg-color);
position: absolute;
border-radius: var(--roundness);
border-radius: 0.1em;
// margin-top: 1.5rem;
bottom: 0.15rem;
bottom: 0.2em;
}
&.activeKey {

2
frontend/src/ts/elements/keymap.ts
View file

@ -89,7 +89,7 @@ async function flashKey(key: string, correct?: boolean): Promise<void> {
.animate(
{
color: themecolors.sub,
backgroundColor: "transparent",
backgroundColor: themecolors.subAlt,
borderColor: themecolors.sub,
},
SlowTimer.get() ? 0 : 500,