81 lines
1.6 KiB
CSS
81 lines
1.6 KiB
CSS
:root {
|
|
/* custom vars */
|
|
--theme-bg-stripe-color: #434653;
|
|
--theme-bg-stripe-opacity: 0.1;
|
|
--theme-accent-stripe-color: #bf8200;
|
|
--current-color: var(--text-color);
|
|
}
|
|
|
|
.colorfulMode {
|
|
--current-color: var(--main-color);
|
|
}
|
|
|
|
button:not(.accountButtonAndMenu *),
|
|
.button:not(.accountButtonAndMenu *),
|
|
[data-ui-element="testConfig"] {
|
|
--roundness: 5em; /* overwriting default roundness to make it softer */
|
|
}
|
|
|
|
/* Notepad style overlay */
|
|
body {
|
|
position: relative;
|
|
}
|
|
|
|
body::before,
|
|
body::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
height: 100%;
|
|
opacity: var(--theme-bg-stripe-opacity);
|
|
display: block;
|
|
z-index: -9999;
|
|
}
|
|
|
|
body::after {
|
|
left: 0;
|
|
width: 100%;
|
|
background-image: linear-gradient(
|
|
0deg,
|
|
var(--theme-bg-stripe-color) 0.1em,
|
|
transparent 0.1em,
|
|
transparent 100%
|
|
);
|
|
background-size: 1em 2em;
|
|
}
|
|
|
|
body::before {
|
|
left: 10vw;
|
|
width: 0.1em;
|
|
background: var(--theme-accent-stripe-color);
|
|
}
|
|
|
|
#commandLine .modal {
|
|
--roundness: 0; /* making command line sharp */
|
|
}
|
|
|
|
/* restyling error displays to be strike-through instead of underlined */
|
|
#wordsWrapper .word.error {
|
|
border-bottom: none;
|
|
}
|
|
|
|
#words .word.error {
|
|
text-shadow: none;
|
|
}
|
|
|
|
#words:not(.blind).colorfulMode .word letter.incorrect:not(.extra),
|
|
#words:not(.blind) .word letter.incorrect:not(.extra) {
|
|
color: var(--current-color);
|
|
}
|
|
|
|
#words:not(.blind) .word.error letter:not(.correct):not(.incorrect)::after {
|
|
background: var(--sub-color);
|
|
}
|
|
|
|
#words:not(.blind) .word letter.incorrect,
|
|
#words:not(.blind).colorfulMode .word letter.incorrect {
|
|
text-decoration: line-through;
|
|
text-decoration-color: var(--error-color);
|
|
text-decoration-thickness: 2px;
|
|
}
|