Skip to content

Commit f51e6ac

Browse files
authored
[C-2961] Fix LeftNav SEO (#3906)
1 parent 6256792 commit f51e6ac

20 files changed

+419
-539
lines changed

packages/probers/cypress/e2e/uploadTrack.cy.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ describe('Upload Track', () => {
99
cy.visit(`trending?login=${base64Entropy}`)
1010
cy.findByText(user.name, { timeout: 20000 }).should('exist')
1111

12-
cy.findByRole('button', { name: /upload track/i }).click()
12+
cy.findByRole('link', { name: /upload track/i }).click()
1313

1414
cy.findByRole('heading', { name: /upload tracks/i, level: 1 }).should(
1515
'exist'
@@ -78,7 +78,7 @@ describe('Upload Track', () => {
7878
cy.visit(`trending?login=${base64Entropy}`)
7979
cy.findByText(user.name, { timeout: 20000 }).should('exist')
8080

81-
cy.findByRole('button', { name: /upload track/i }).click()
81+
cy.findByRole('link', { name: /upload track/i }).click()
8282

8383
cy.findByRole('heading', { name: /upload tracks/i, level: 1 }).should(
8484
'exist'

packages/stems/src/components/Button/Button.module.css

+30-31
Original file line numberDiff line numberDiff line change
@@ -115,7 +115,6 @@
115115
opacity: var(--overlay-opacity, 0);
116116
}
117117

118-
119118
/* Primary Button */
120119

121120
.primary {
@@ -137,17 +136,17 @@
137136
fill: var(--primary-secondary-text);
138137
}
139138

140-
.primary.includeHoverAnimations:hover:enabled {
139+
.primary.includeHoverAnimations:hover.enabled {
141140
--overlay-color: var(--static-white);
142-
--overlay-opacity: .1;
141+
--overlay-opacity: 0.1;
143142
box-shadow: var(--shadow-mid);
144143
transform: var(--grow);
145144
background: var(--button-color);
146145
}
147146

148-
.primary.includeHoverAnimations:active:enabled {
147+
.primary.includeHoverAnimations:active.enabled {
149148
--overlay-color: var(--static-blck);
150-
--overlay-opacity: .2;
149+
--overlay-opacity: 0.2;
151150
box-shadow: none;
152151
transform: perspective(1px) scale3d(0.99, 0.99, 0.99);
153152
background: var(--button-color);
@@ -174,12 +173,12 @@
174173
fill: var(--primary-secondary-text);
175174
}
176175

177-
.primaryAlt.includeHoverAnimations:hover:enabled {
176+
.primaryAlt.includeHoverAnimations:hover.enabled {
178177
transform: var(--grow);
179178
background: var(--primary-light-1);
180179
}
181180

182-
.primaryAlt.includeHoverAnimations:active:enabled {
181+
.primaryAlt.includeHoverAnimations:active.enabled {
183182
transform: perspective(1px) scale3d(0.99, 0.99, 0.99);
184183
background: var(--primary-dark-1);
185184
}
@@ -213,22 +212,22 @@
213212
fill: var(--primary);
214213
}
215214

216-
.secondary.includeHoverAnimations:hover:enabled {
215+
.secondary.includeHoverAnimations:hover.enabled {
217216
transform: var(--grow);
218217
border: 1px solid var(--primary-dark-2);
219218
background: var(--primary);
220219
}
221220

222-
.secondary.includeHoverAnimations:hover:enabled .textLabel {
221+
.secondary.includeHoverAnimations:hover.enabled .textLabel {
223222
color: var(--primary-secondary-text);
224223
}
225224

226-
.secondary.includeHoverAnimations:hover:enabled .icon path,
227-
.secondary.includeHoverAnimations:hover:enabled .icon use {
225+
.secondary.includeHoverAnimations:hover.enabled .icon path,
226+
.secondary.includeHoverAnimations:hover.enabled .icon use {
228227
fill: var(--primary-secondary-text);
229228
}
230229

231-
.secondary.includeHoverAnimations:active:enabled {
230+
.secondary.includeHoverAnimations:active.enabled {
232231
transform: perspective(1px) scale3d(0.99, 0.99, 0.99);
233232
border: 1px solid var(--primary-dark-2);
234233
background: var(--primary-dark-2);
@@ -254,12 +253,12 @@
254253
fill: var(--secondary);
255254
}
256255

257-
.tertiary.includeHoverAnimations:hover:enabled {
256+
.tertiary.includeHoverAnimations:hover.enabled {
258257
transform: var(--grow);
259258
background-color: var(--static-white);
260259
}
261260

262-
.tertiary.includeHoverAnimations:active:enabled {
261+
.tertiary.includeHoverAnimations:active.enabled {
263262
transform: perspective(1px) scale3d(0.99, 0.99, 0.99);
264263
}
265264

@@ -292,32 +291,32 @@
292291
fill: var(--neutral);
293292
}
294293

295-
.common.includeHoverAnimations:hover:enabled {
294+
.common.includeHoverAnimations:hover.enabled {
296295
transform: var(--grow);
297296
border: 1px solid var(--primary-dark-2);
298297
background: var(--primary);
299298
}
300299

301-
.common.includeHoverAnimations:hover:enabled .textLabel {
300+
.common.includeHoverAnimations:hover.enabled .textLabel {
302301
color: var(--primary-secondary-text);
303302
}
304303

305-
.common.includeHoverAnimations:hover:enabled .icon path,
306-
.common.includeHoverAnimations:hover:enabled .icon use {
304+
.common.includeHoverAnimations:hover.enabled .icon path,
305+
.common.includeHoverAnimations:hover.enabled .icon use {
307306
fill: var(--primary-secondary-text);
308307
}
309308

310-
.common.includeHoverAnimations:active:enabled {
309+
.common.includeHoverAnimations:active.enabled {
311310
transform: perspective(1px) scale3d(0.99, 0.99, 0.99);
312311
border: 1px solid var(--primary-dark-2);
313312
background: var(--primary-dark-2);
314313
}
315314

316-
.common.includeHoverAnimations:active:enabled .textLabel {
315+
.common.includeHoverAnimations:active.enabled .textLabel {
317316
color: var(--primary-secondary-text);
318317
}
319318

320-
.common.includeHoverAnimations:active:enabled .icon path {
319+
.common.includeHoverAnimations:active.enabled .icon path {
321320
fill: var(--primary-secondary-text);
322321
}
323322

@@ -345,13 +344,13 @@
345344
fill: var(--neutral);
346345
}
347346

348-
.commonAlt:hover:enabled {
347+
.commonAlt:hover.enabled {
349348
transform: var(--grow);
350349
border: 1px solid var(--neutral-light-6);
351350
background: var(--neutral-light-10);
352351
}
353352

354-
.commonAlt.includeHoverAnimations:active:enabled {
353+
.commonAlt.includeHoverAnimations:active.enabled {
355354
transform: perspective(1px) scale3d(0.99, 0.99, 0.99);
356355
border: 1px solid var(--neutral-light-6);
357356
background: var(--neutral-light-8);
@@ -377,12 +376,12 @@
377376
fill: var(--white);
378377
}
379378

380-
.glass.includeHoverAnimations:hover:enabled {
379+
.glass.includeHoverAnimations:hover.enabled {
381380
transform: var(--grow);
382381
background-color: rgba(255, 255, 255, 0.2);
383382
}
384383

385-
.glass.includeHoverAnimations:active:enabled {
384+
.glass.includeHoverAnimations:active.enabled {
386385
transform: perspective(1px) scale3d(1, 1, 1);
387386
background-color: rgba(255, 255, 255, 0.05);
388387
}
@@ -432,14 +431,14 @@
432431
fill: var(--secondary);
433432
}
434433

435-
.white.includeHoverAnimations:hover:enabled {
434+
.white.includeHoverAnimations:hover.enabled {
436435
transform: var(--grow);
437436
background-color: var(--static-white);
438437
box-shadow: 0 1px 0 0 var(--neutral-light-5),
439438
0 5px 20px -3px rgba(0, 0, 0, 0.3);
440439
}
441440

442-
.white.includeHoverAnimations:active:enabled {
441+
.white.includeHoverAnimations:active.enabled {
443442
background-color: #eeeeee;
444443
box-shadow: 0 1px 0 0 var(--neutral-light-4),
445444
0 4px 12px -4px rgba(0, 0, 0, 0.3);
@@ -517,21 +516,21 @@
517516
}
518517

519518
/** destructive hover **/
520-
.destructive.includeHoverAnimations:hover:enabled {
519+
.destructive.includeHoverAnimations:hover.enabled {
521520
transform: var(--grow);
522521
background-color: var(--accent-red);
523522
}
524523

525-
.destructive.includeHoverAnimations:active:enabled {
524+
.destructive.includeHoverAnimations:active.enabled {
526525
transform: perspective(1px) scale3d(0.99, 0.99, 0.99);
527526
background-color: var(--accent-red-dark-1);
528527
}
529528

530-
.destructive.includeHoverAnimations:hover:enabled .textLabel {
529+
.destructive.includeHoverAnimations:hover.enabled .textLabel {
531530
color: white;
532531
}
533532

534-
.destructive.includeHoverAnimations:hover:enabled .icon path {
533+
.destructive.includeHoverAnimations:hover.enabled .icon path {
535534
fill: var(--static-white);
536535
}
537536

0 commit comments

Comments
 (0)