Skip to content

Commit 2b4c51a

Browse files
nadalabanadalaba
committed
re-add no-descending-specificity
1 parent ec7370c commit 2b4c51a

14 files changed

Lines changed: 135 additions & 128 deletions

File tree

‎backend/private/style.css‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -189,10 +189,6 @@ input[type="checkbox"] {
189189
}
190190
}
191191

192-
.tooltip:hover .tooltip-text {
193-
display: block;
194-
}
195-
196192
.tooltip-text {
197193
display: none;
198194
color: var(--text-color);
@@ -202,3 +198,7 @@ input[type="checkbox"] {
202198
padding: 10px;
203199
border-radius: var(--roundness);
204200
}
201+
202+
.tooltip:hover .tooltip-text {
203+
display: block;
204+
}

‎frontend/static/themes/aurora.css‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -68,6 +68,11 @@ a:not(.button):not([data-ui-variant="button"]):hover {
6868
--untyped-letter-animation: aurora 5s linear infinite;
6969
}
7070

71+
#words.highlight-off .word letter,
72+
#words.highlight-off .word.typed letter {
73+
animation: aurora 5s linear infinite;
74+
}
75+
7176
#words .word.typed letter.correct,
7277
#words.highlight-word .word.typed letter,
7378
#words.highlight-next-word .word.typed letter,
@@ -79,8 +84,3 @@ a:not(.button):not([data-ui-variant="button"]):hover {
7984
#words.flipped .word.typed letter {
8085
animation: none;
8186
}
82-
83-
#words.highlight-off .word letter,
84-
#words.highlight-off .word.typed letter {
85-
animation: aurora 5s linear infinite;
86-
}

‎frontend/static/themes/chaos_theory.css‎

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -13,22 +13,6 @@
1313
transition: 0.5s;
1414
}
1515

16-
header[data-focused] {
17-
& [data-ui-element="logo"] > div,
18-
[data-ui-element="logo"] svg {
19-
transform: rotateY(0deg);
20-
direction: ltr;
21-
}
22-
& [data-nav-item] {
23-
--nav-focus-opacity: 1;
24-
background: var(--sub-color);
25-
transform: rotateY(180deg);
26-
}
27-
& [data-nav-item="account"] {
28-
--themable-button-bg: var(--sub-color);
29-
}
30-
}
31-
3216
#words .incorrect.extra {
3317
transform: rotateY(180deg);
3418
unicode-bidi: bidi-override;
@@ -128,6 +112,22 @@ header[data-focused] {
128112
background: #ab92e1;
129113
}
130114

115+
header[data-focused] {
116+
& [data-ui-element="logo"] > div,
117+
[data-ui-element="logo"] svg {
118+
transform: rotateY(0deg);
119+
direction: ltr;
120+
}
121+
& [data-nav-item] {
122+
--nav-focus-opacity: 1;
123+
background: var(--sub-color);
124+
transform: rotateY(180deg);
125+
}
126+
& [data-nav-item="account"] {
127+
--themable-button-bg: var(--sub-color);
128+
}
129+
}
130+
131131
body.crtmode {
132132
& [data-nav-item="test"] {
133133
box-shadow:

‎frontend/static/themes/dark_note.css‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -63,18 +63,18 @@ body::before {
6363
text-shadow: none;
6464
}
6565

66-
#words:not(.blind).colorfulMode .word letter.incorrect:not(.extra),
67-
#words:not(.blind) .word letter.incorrect:not(.extra) {
68-
color: var(--current-color);
69-
}
70-
71-
#words:not(.blind) .word.error letter:not(.correct):not(.incorrect)::after {
72-
background: var(--sub-color);
73-
}
74-
7566
#words:not(.blind) .word letter.incorrect,
7667
#words:not(.blind).colorfulMode .word letter.incorrect {
7768
text-decoration: line-through;
7869
text-decoration-color: var(--error-color);
7970
text-decoration-thickness: 2px;
8071
}
72+
73+
#words:not(.blind) .word letter.incorrect:not(.extra),
74+
#words:not(.blind).colorfulMode .word letter.incorrect:not(.extra) {
75+
color: var(--current-color);
76+
}
77+
78+
#words:not(.blind) .word.error letter:not(.correct):not(.incorrect)::after {
79+
background: var(--sub-color);
80+
}

‎frontend/static/themes/dmg.css‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,8 +34,8 @@ body.crtmode {
3434
0 0 3px;
3535
}
3636

37-
& header[data-focused] [data-nav-item],
38-
& [data-nav-item]:hover {
37+
& [data-nav-item]:hover,
38+
& header[data-focused] [data-nav-item] {
3939
box-shadow: none;
4040
}
4141

‎frontend/static/themes/fire.css‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -74,6 +74,11 @@ a:not(.button):not([data-ui-variant="button"]):hover {
7474
--untyped-letter-animation: fire 5s linear infinite;
7575
}
7676

77+
#words.highlight-off .word letter,
78+
#words.highlight-off .word.typed letter {
79+
animation: fire 5s linear infinite;
80+
}
81+
7782
#words .word.typed letter.correct,
7883
#words.highlight-word .word.typed letter,
7984
#words.highlight-next-word .word.typed letter,
@@ -85,8 +90,3 @@ a:not(.button):not([data-ui-variant="button"]):hover {
8590
#words.flipped .word.typed letter {
8691
animation: none;
8792
}
88-
89-
#words.highlight-off .word letter,
90-
#words.highlight-off .word.typed letter {
91-
animation: fire 5s linear infinite;
92-
}

‎frontend/static/themes/grape.css‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,11 @@ a:not(.button):not([data-ui-variant="button"]):hover {
6969
--untyped-letter-animation: grape 5s linear infinite;
7070
}
7171

72+
#words.highlight-off .word letter,
73+
#words.highlight-off .word.typed letter {
74+
animation: grape 5s linear infinite;
75+
}
76+
7277
#words .word.typed letter.correct,
7378
#words.highlight-word .word.typed letter,
7479
#words.highlight-next-word .word.typed letter,
@@ -80,8 +85,3 @@ a:not(.button):not([data-ui-variant="button"]):hover {
8085
#words.flipped .word.typed letter {
8186
animation: none;
8287
}
83-
84-
#words.highlight-off .word letter,
85-
#words.highlight-off .word.typed letter {
86-
animation: grape 5s linear infinite;
87-
}

‎frontend/static/themes/phantom.css‎

Lines changed: 33 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,34 @@ header:not([data-focused]) [data-ui-element="logoText"] {
5959
animation: phantom-glow 3s infinite alternate;
6060
}
6161

62+
button:hover,
63+
.button:hover,
64+
input[type="button"]:hover,
65+
input[type="reset"]:hover,
66+
input[type="submit"]:hover {
67+
color: var(--bg-color);
68+
background: var(--caret-color);
69+
}
70+
71+
footer a:hover,
72+
footer button:hover {
73+
animation: phantom-glow 3s linear infinite;
74+
background: none;
75+
}
76+
77+
[data-ui-element="accountMenu"] a:hover,
78+
[data-ui-element="accountMenu"] button:hover {
79+
animation: none;
80+
background: var(--text-color);
81+
}
82+
83+
[data-ui-element="logoSubtext"],
84+
#result .stats .group .bottom,
85+
[data-nav-item]:hover,
86+
a:not(.button):not([data-ui-variant="button"]):hover {
87+
animation: phantom-glow 3s linear infinite;
88+
}
89+
6290
header [data-ui-element="logoSubtext"] {
6391
color: inherit;
6492
animation: none;
@@ -89,15 +117,6 @@ button.text:hover,
89117
animation: phantom-glow 5s linear infinite;
90118
}
91119

92-
button:hover,
93-
.button:hover,
94-
input[type="button"]:hover,
95-
input[type="reset"]:hover,
96-
input[type="submit"]:hover {
97-
color: var(--bg-color);
98-
background: var(--caret-color);
99-
}
100-
101120
.scrollToTopButton:hover {
102121
background: var(--caret-color);
103122
color: var(--bg-color);
@@ -107,19 +126,6 @@ input[type="submit"]:hover {
107126
animation: phantom-bg 3s linear infinite;
108127
}
109128

110-
[data-ui-element="logoSubtext"],
111-
#result .stats .group .bottom,
112-
[data-nav-item]:hover,
113-
a:not(.button):not([data-ui-variant="button"]):hover {
114-
animation: phantom-glow 3s linear infinite;
115-
}
116-
117-
footer a:hover,
118-
footer button:hover {
119-
animation: phantom-glow 3s linear infinite;
120-
background: none;
121-
}
122-
123129
[data-nav-item]:hover {
124130
background: none;
125131
}
@@ -129,6 +135,11 @@ footer button:hover {
129135
animation: phantom-glow 3s linear infinite;
130136
}
131137

138+
#words.highlight-off .word letter,
139+
#words.highlight-off .word.typed letter {
140+
animation: phantom-glow 5s linear infinite;
141+
}
142+
132143
.afk,
133144
.timeToday,
134145
#words .word letter.correct,
@@ -147,14 +158,3 @@ footer button:hover {
147158
.incorrect {
148159
animation: phantom-glow-incorrect 5s linear infinite;
149160
}
150-
151-
#words.highlight-off .word letter,
152-
#words.highlight-off .word.typed letter {
153-
animation: phantom-glow 5s linear infinite;
154-
}
155-
156-
[data-ui-element="accountMenu"] a:hover,
157-
[data-ui-element="accountMenu"] button:hover {
158-
animation: none;
159-
background: var(--text-color);
160-
}

‎frontend/static/themes/rainbow_trail.css‎

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,11 @@ header [data-ui-element="logoSubtext"],
3131

3232
button.text:hover,
3333
.textButton:hover,
34+
footer a:hover,
35+
footer a:hover > i,
36+
footer button:hover,
37+
footer button:hover > i,
38+
footer button:hover > .relative > i,
3439
#restartTestButton:hover > i,
3540
#restartTestButton:hover > i,
3641
#showWordHistoryButton:hover > i,
@@ -39,12 +44,7 @@ button.text:hover,
3944
#nextTestButton:hover > i,
4045
#practiseWordsButton:hover > i,
4146
#watchReplayButton:hover > i,
42-
#watchVideoAdButton:hover > i,
43-
footer a:hover,
44-
footer a:hover > i,
45-
footer button:hover,
46-
footer button:hover > i,
47-
footer button:hover > .relative > i {
47+
#watchVideoAdButton:hover > i {
4848
background: linear-gradient(
4949
90deg,
5050
#60b6ce,
@@ -78,6 +78,11 @@ footer button:hover > .relative > i {
7878
infinite;
7979
}
8080

81+
#words.highlight-off .word letter,
82+
#words.highlight-off .word.typed letter {
83+
animation: rainbow-infinite-loop 5s linear infinite;
84+
}
85+
8186
#words .word.typed letter.correct,
8287
#words.highlight-word .word.typed letter,
8388
#words.highlight-next-word .word.typed letter,
@@ -103,17 +108,16 @@ footer button:hover > .relative > i {
103108
animation: none;
104109
}
105110

111+
footer button:hover {
112+
animation: none !important;
113+
}
114+
106115
.button:hover,
107116
button:not(.textButton):not(.text):not([data-ui-variant="text"]):hover,
108117
[data-nav-item]:hover {
109118
animation: rainbow-button 2s alternate ease-in-out infinite;
110119
}
111120

112-
#words.highlight-off .word letter,
113-
#words.highlight-off .word.typed letter {
114-
animation: rainbow-infinite-loop 5s linear infinite;
115-
}
116-
117121
.row .textButton:not(.active) {
118122
color: #999999;
119123
}
@@ -122,10 +126,6 @@ button:not(.textButton):not(.text):not([data-ui-variant="text"]):hover,
122126
color: #111111;
123127
}
124128

125-
footer button:hover {
126-
animation: none !important;
127-
}
128-
129129
@keyframes rainbow {
130130
0% {
131131
color: #60b6ce;

‎frontend/static/themes/rgb.css‎

Lines changed: 24 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,28 @@
7171
animation: rgb-bg 5s linear infinite !important;
7272
}
7373

74+
[data-ui-element="logoSubtext"],
75+
#result .stats .group .bottom,
76+
[data-nav-item]:hover,
77+
footer button:hover,
78+
#words.flipped .word,
79+
footer a:hover {
80+
animation: rgb 5s linear infinite;
81+
}
82+
83+
[data-ui-element="accountMenu"] a:hover,
84+
[data-ui-element="accountMenu"] button:hover {
85+
animation: none;
86+
}
87+
88+
a:not(.button):not([data-ui-variant="button"]):hover {
89+
animation: rgb 5s linear infinite;
90+
}
91+
92+
header [data-ui-element="logo"] svg path {
93+
animation: rgb-fill 5s linear infinite;
94+
}
95+
7496
header[data-focused] {
7597
& [data-ui-element="logoSubtext"] {
7698
animation: none;
@@ -80,14 +102,8 @@ header[data-focused] {
80102
}
81103
}
82104

83-
[data-ui-element="logoSubtext"],
84-
#result .stats .group .bottom,
85-
[data-nav-item]:hover,
86-
footer button:hover,
87-
#words.flipped .word,
88-
footer a:hover,
89-
a:not(.button):not([data-ui-variant="button"]):hover {
90-
animation: rgb 5s linear infinite;
105+
header [data-nav-item="account"]:hover [data-ui-element="navAvatar"] svg path {
106+
animation: rgb-fill 5s linear infinite;
91107
}
92108

93109
#words {
@@ -98,13 +114,3 @@ a:not(.button):not([data-ui-variant="button"]):hover {
98114
--correct-letter-animation: none;
99115
--untyped-letter-animation: rgb 5s linear infinite;
100116
}
101-
102-
header [data-ui-element="logo"] svg path,
103-
header [data-nav-item="account"]:hover [data-ui-element="navAvatar"] svg path {
104-
animation: rgb-fill 5s linear infinite;
105-
}
106-
107-
[data-ui-element="accountMenu"] a:hover,
108-
[data-ui-element="accountMenu"] button:hover {
109-
animation: none;
110-
}

0 commit comments

Comments
 (0)