monkeytype/static/themes/rgb.css

95 lines
1.8 KiB
CSS
Raw Normal View History

:root {
2020-08-12 05:02:25 +08:00
--bg-color: #111;
--main-color: #eee;
--caret-color: #eee;
--sub-color: #444;
--text-color: #eee;
--error-color: #eee;
--error-extra-color: #b3b3b3;
--colorful-error-color: #eee;
--colorful-error-extra-color: #b3b3b3;
}
2020-08-12 05:02:25 +08:00
@keyframes rgb {
0% {
color: #f44336;
}
25% {
color: #ffc107;
}
50% {
color: #4caf50;
}
75% {
color: #3f51b5;
}
100% {
color: #f44336;
}
}
2020-08-12 05:02:25 +08:00
@keyframes rgb-bg {
0% {
background: #f44336;
}
25% {
background: #ffc107;
}
50% {
background: #4caf50;
}
75% {
background: #3f51b5;
}
100% {
background: #f44336;
}
}
2020-05-30 22:42:06 +08:00
.button.discord::after,
2020-06-01 07:06:02 +08:00
#caret,
.pageSettings .section .buttons .button.active,
.pageSettings .section.languages .buttons .language.active,
2020-08-12 05:02:25 +08:00
.pageAccount .group.filterButtons .buttons .button.active {
animation-name: rgb-bg !important;
animation-duration: 5s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}
#top.focus .button.discord::after,
2020-08-12 05:02:25 +08:00
#top .button.discord.dotHidden::after {
animation-name: none !important;
2020-05-30 22:42:06 +08:00
}
.logo .bottom,
#top .config .group .buttons .text-button.active,
#result .stats .group .bottom,
#menu .icon-button:hover,
#top .config .group .buttons .text-button:hover,
2020-06-01 07:06:02 +08:00
a:hover,
2020-08-12 05:02:25 +08:00
#words.flipped .word {
animation-name: rgb;
animation-duration: 5s;
animation-iteration-count: infinite;
animation-timing-function: linear;
2020-06-01 07:06:02 +08:00
}
/* .word letter.correct{
animation-name: rgb;
2020-06-01 07:06:02 +08:00
animation-duration: 5s;
animation-iteration-count: infinite;
animation-timing-function: linear;
2020-06-01 07:06:02 +08:00
} */
#words.flipped .word letter.correct {
2020-08-12 05:02:25 +08:00
color: var(--sub-color);
}
2020-06-01 07:06:02 +08:00
#words:not(.flipped) .word letter.correct {
2020-08-12 05:02:25 +08:00
animation-name: rgb;
animation-duration: 5s;
animation-iteration-count: infinite;
animation-timing-function: linear;
2020-06-01 07:06:02 +08:00
}