@uimaxbai/am-lyrics 1.2.2 → 1.2.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/demo/index.html +2 -2
- package/dist/src/AmLyrics.d.ts.map +1 -1
- package/dist/src/am-lyrics.js +52 -50
- package/dist/src/am-lyrics.js.map +1 -1
- package/dist/src/react.js +52 -50
- package/dist/src/react.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/src/AmLyrics.ts +67 -51
package/demo/index.html
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AmLyrics.d.ts","sourceRoot":"","sources":["../../src/AmLyrics.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAO,MAAM,KAAK,CAAC;AAsHjD,qBAAa,QAAS,SAAQ,UAAU;IACtC,MAAM,CAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"AmLyrics.d.ts","sourceRoot":"","sources":["../../src/AmLyrics.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAO,MAAM,KAAK,CAAC;AAsHjD,qBAAa,QAAS,SAAQ,UAAU;IACtC,MAAM,CAAC,MAAM,0BA2qCX;IAGF,KAAK,CAAC,EAAE,MAAM,CAAC;IAGf,OAAO,CAAC,EAAE,MAAM,CAAC;IAGjB,IAAI,CAAC,EAAE,MAAM,CAAC;IAGd,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,OAAO,CAAC,cAAc,CAAmC;IAGzD,UAAU,CAAC,EAAE,MAAM,CAAC;IAGpB,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,cAAc,CAAC,EAAE,MAAM,CAAC;IAGxB,cAAc,SAAa;IAG3B,oBAAoB,SAA+B;IAGnD,UAAU,CAAC,EAAE,MAAM,CAAC;IAGpB,UAAU,UAAQ;IAGlB,WAAW,UAAQ;IAGnB,OAAO,CAAC,gBAAgB,CAAS;IAGjC,OAAO,CAAC,eAAe,CAAS;YAElB,kBAAkB;YAKlB,iBAAiB;YAsBjB,iBAAiB;YAKjB,gBAAgB;IAyC9B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,OAAO,CAAC,YAAY,CAAK;IAEzB,IACI,WAAW,CAAC,KAAK,EAAE,MAAM,EAM5B;IAED,IAAI,WAAW,IAAI,MAAM,CAExB;IAGD,OAAO,CAAC,SAAS,CAAS;IAG1B,OAAO,CAAC,MAAM,CAAC,CAAe;IAE9B,OAAO,CAAC,iBAAiB,CAAgB;IAEzC,OAAO,CAAC,qBAAqB,CAAkC;IAE/D,OAAO,CAAC,2BAA2B,CAAkC;IAErE,OAAO,CAAC,gBAAgB,CAAkC;IAE1D,OAAO,CAAC,sBAAsB,CAAkC;IAGhE,OAAO,CAAC,YAAY,CAAuB;IAG3C,OAAO,CAAC,gBAAgB,CAAiD;IAGzE,OAAO,CAAC,kBAAkB,CAAK;IAG/B,OAAO,CAAC,sBAAsB,CAAS;IAGvC,OAAO,CAAC,sBAAsB,CAAS;IAEvC,OAAO,CAAC,gBAAgB,CAAC,CAAS;IAElC,OAAO,CAAC,kBAAkB,CAGZ;IAEd,OAAO,CAAC,wBAAwB,CAGlB;IAGd,OAAO,CAAC,eAAe,CAAC,CAAc;IAEtC,OAAO,CAAC,qBAAqB,CAAuB;IAEpD,OAAO,CAAC,mBAAmB,CAAC,CAAS;IAGrC,OAAO,CAAC,eAAe,CAAS;IAEhC,OAAO,CAAC,oBAAoB,CAAS;IAErC,OAAO,CAAC,cAAc,CAAS;IAE/B,OAAO,CAAC,gBAAgB,CAAC,CAAgC;IAGzD,OAAO,CAAC,iBAAiB,CAAqB;IAG9C,OAAO,CAAC,aAAa,CAA0B;IAE/C,OAAO,CAAC,wBAAwB,CAA4B;IAE5D,OAAO,CAAC,qBAAqB,CAA4B;IAGzD,OAAO,CAAC,oBAAoB,CAGZ;IAEhB,OAAO,CAAC,mBAAmB,CAAK;IAEhC,OAAO,CAAC,cAAc,CAAqB;IAE3C,OAAO,CAAC,mBAAmB,CAAC,CAAgC;IAE5D,OAAO,CAAC,sBAAsB,CAAC,CAAgC;IAG/D,OAAO,CAAC,oBAAoB,CAAC,CAAkB;IAG/C,OAAO,CAAC,eAAe,CAAK;IAE5B,OAAO,CAAC,cAAc,CAA0B;IAGhD,OAAO,CAAC,sBAAsB,CAAoC;IAElE,OAAO,CAAC,qBAAqB,CAAmC;IAEhE,iBAAiB;IAKjB,oBAAoB;YAsCN,WAAW;YA8GX,cAAc;YAoBd,iBAAiB;IAS/B,OAAO,CAAC,MAAM,CAAC,mBAAmB;IAwClC,OAAO,CAAC,MAAM,CAAC,mBAAmB;YA8BpB,YAAY;YA+EZ,mBAAmB;IAiGjC,OAAO,CAAC,MAAM,CAAC,kBAAkB;mBAkCZ,uBAAuB;mBA6CvB,wBAAwB;IAqP7C;;;OAGG;IACH,OAAO,CAAC,MAAM,CAAC,iBAAiB;IA4DhC;;;OAGG;mBACkB,oBAAoB;IA0FzC;;;OAGG;mBACkB,qBAAqB;mBAyErB,qBAAqB;IAoD1C,OAAO,CAAC,MAAM,CAAC,uBAAuB;IAkEtC,OAAO,CAAC,MAAM,CAAC,SAAS;IA+RxB,OAAO,CAAC,MAAM,CAAC,iBAAiB;IAqJhC,OAAO,CAAC,MAAM,CAAC,cAAc;IAa7B,YAAY;IAkBZ;;;;;OAKG;IACH,OAAO,CAAC,cAAc;IAuLtB,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,OAAO,CAAC;IAuEjE;;;OAGG;IACH,OAAO,CAAC,uBAAuB;IAsB/B,OAAO,CAAC,gBAAgB,CAAgC;IAExD,OAAO,CAAC,aAAa,CAA8C;IAEnE,OAAO,CAAC,aAAa;IAcrB,OAAO,CAAC,qBAAqB;IAsE7B,OAAO,CAAC,MAAM,CAAC,WAAW;IAI1B,OAAO,CAAC,MAAM,CAAC,uBAAuB;IAQtC,OAAO,CAAC,MAAM,CAAC,eAAe;IAc9B,OAAO,CAAC,qBAAqB;IAc7B,OAAO,CAAC,yBAAyB;IAqBjC,OAAO,CAAC,SAAS;IA0BjB,OAAO,CAAC,gBAAgB;IA2BxB,OAAO,CAAC,qBAAqB;IA6B7B,OAAO,CAAC,qBAAqB;IAiC7B;;;OAGG;IACH,OAAO,CAAC,uBAAuB;IAgC/B,OAAO,CAAC,sBAAsB;IAgE9B,OAAO,CAAC,wBAAwB;IA0ChC,OAAO,CAAC,eAAe;IA4CvB,OAAO,CAAC,eAAe;IA6EvB,OAAO,CAAC,MAAM,CAAC,0BAA0B;IAkBzC,OAAO,CAAC,kBAAkB;IA2C1B,OAAO,CAAC,oBAAoB;IAyB5B;;OAEG;IACH,OAAO,CAAC,mBAAmB;IAa3B;;OAEG;IACH,OAAO,CAAC,kBAAkB;IA4J1B;;OAEG;IACH,OAAO,CAAC,qBAAqB;IA+C7B;;OAEG;IACH,OAAO,CAAC,uBAAuB;IAmD/B;;;OAGG;IACH,OAAO,CAAC,MAAM,CAAC,uBAAuB;IA6MtC;;OAEG;IACH,OAAO,CAAC,MAAM,CAAC,aAAa;IAwC5B;;OAEG;IACH,OAAO,CAAC,MAAM,CAAC,cAAc;IAS7B;;;OAGG;IACH,OAAO,CAAC,MAAM,CAAC,sBAAsB;IAuErC,OAAO,CAAC,eAAe;IA0HvB,OAAO,CAAC,WAAW;IAyBnB,OAAO,CAAC,YAAY;IA2DpB,OAAO,CAAC,MAAM,CAAC,kBAAkB;IAUjC,OAAO,CAAC,MAAM,CAAC,mBAAmB;IAYlC,OAAO,CAAC,cAAc;IAuCtB,MAAM;CAyoBP"}
|
package/dist/src/am-lyrics.js
CHANGED
|
@@ -319,7 +319,7 @@ class GoogleService {
|
|
|
319
319
|
}
|
|
320
320
|
}
|
|
321
321
|
|
|
322
|
-
const VERSION = '1.2.
|
|
322
|
+
const VERSION = '1.2.4';
|
|
323
323
|
const INSTRUMENTAL_THRESHOLD_MS = 7000; // Show dots for gaps >= 7s
|
|
324
324
|
const FETCH_TIMEOUT_MS = 8000; // Timeout for all lyrics fetch requests
|
|
325
325
|
const SEEK_THRESHOLD_MS = 500;
|
|
@@ -537,7 +537,8 @@ class AmLyrics extends i {
|
|
|
537
537
|
const isMusicIdOnlyRequest = Boolean(this.musicId) &&
|
|
538
538
|
!this.songTitle &&
|
|
539
539
|
!this.songArtist &&
|
|
540
|
-
!this.query
|
|
540
|
+
!this.query &&
|
|
541
|
+
!this.isrc;
|
|
541
542
|
const collectedSources = [];
|
|
542
543
|
if (resolvedMetadata?.metadata && !isMusicIdOnlyRequest) {
|
|
543
544
|
const title = resolvedMetadata.metadata.title?.trim() || '';
|
|
@@ -754,7 +755,7 @@ class AmLyrics extends i {
|
|
|
754
755
|
}
|
|
755
756
|
const appleSong = null;
|
|
756
757
|
let appleId = this.musicId;
|
|
757
|
-
let catalogIsrc;
|
|
758
|
+
let catalogIsrc = this.isrc;
|
|
758
759
|
if (this.query &&
|
|
759
760
|
(!metadata.title || !metadata.artist || !metadata.album)) {
|
|
760
761
|
const parsed = AmLyrics.parseQueryMetadata(this.query);
|
|
@@ -881,9 +882,15 @@ class AmLyrics extends i {
|
|
|
881
882
|
return null;
|
|
882
883
|
}
|
|
883
884
|
static async fetchLyricsFromYouLyPlus(title, artist, isrc, metadata = {}) {
|
|
884
|
-
if (!title || !artist)
|
|
885
|
+
if ((!title || !artist) && !isrc)
|
|
885
886
|
return [];
|
|
886
|
-
const params = new URLSearchParams(
|
|
887
|
+
const params = new URLSearchParams();
|
|
888
|
+
if (title)
|
|
889
|
+
params.append('title', title);
|
|
890
|
+
if (artist)
|
|
891
|
+
params.append('artist', artist);
|
|
892
|
+
if (isrc)
|
|
893
|
+
params.append('isrc', isrc);
|
|
887
894
|
if (metadata.album) {
|
|
888
895
|
params.append('album', metadata.album);
|
|
889
896
|
}
|
|
@@ -944,7 +951,7 @@ class AmLyrics extends i {
|
|
|
944
951
|
}
|
|
945
952
|
}
|
|
946
953
|
// Second attempt: Fallback to title and artist search if ISRC search failed or was not available
|
|
947
|
-
if (!cacheData) {
|
|
954
|
+
if (!cacheData && title && artist) {
|
|
948
955
|
const cacheParams = new URLSearchParams({
|
|
949
956
|
track: title,
|
|
950
957
|
artist,
|
|
@@ -1902,7 +1909,8 @@ class AmLyrics extends i {
|
|
|
1902
1909
|
preActiveLineIndex = i;
|
|
1903
1910
|
nextLineEl.classList.add('pre-active');
|
|
1904
1911
|
this.clearPreActiveClasses(i);
|
|
1905
|
-
|
|
1912
|
+
const slowScrollDuration = Math.max(SCROLL_ANIMATION_DURATION_MS, timeUntilStart);
|
|
1913
|
+
this.focusLine(nextLineEl, false, slowScrollDuration, !!currentGap);
|
|
1906
1914
|
}
|
|
1907
1915
|
break;
|
|
1908
1916
|
}
|
|
@@ -2096,18 +2104,19 @@ class AmLyrics extends i {
|
|
|
2096
2104
|
}
|
|
2097
2105
|
return candidateIndex;
|
|
2098
2106
|
}
|
|
2099
|
-
focusLine(lineElement, forceScroll = false) {
|
|
2107
|
+
focusLine(lineElement, forceScroll = false, scrollDuration = undefined, skipScroll = false) {
|
|
2100
2108
|
const primaryChanged = lineElement !== this.currentPrimaryActiveLine;
|
|
2101
2109
|
if (primaryChanged) {
|
|
2102
2110
|
this.lastPrimaryActiveLine = this.currentPrimaryActiveLine;
|
|
2103
2111
|
this.currentPrimaryActiveLine = lineElement;
|
|
2104
2112
|
}
|
|
2105
2113
|
this.updatePositionClasses(lineElement);
|
|
2106
|
-
if (
|
|
2114
|
+
if (!skipScroll &&
|
|
2115
|
+
(forceScroll || primaryChanged) &&
|
|
2107
2116
|
this.autoScroll &&
|
|
2108
2117
|
!this.isUserScrolling &&
|
|
2109
2118
|
!this.isClickSeeking) {
|
|
2110
|
-
this.scrollToActiveLineYouLy(lineElement, forceScroll);
|
|
2119
|
+
this.scrollToActiveLineYouLy(lineElement, forceScroll, scrollDuration);
|
|
2111
2120
|
}
|
|
2112
2121
|
}
|
|
2113
2122
|
handleUserScroll() {
|
|
@@ -2480,7 +2489,7 @@ class AmLyrics extends i {
|
|
|
2480
2489
|
/**
|
|
2481
2490
|
* Animate scroll with staggered delay for smooth YouLyPlus-style scrolling
|
|
2482
2491
|
*/
|
|
2483
|
-
animateScrollYouLy(newTranslateY, forceScroll = false) {
|
|
2492
|
+
animateScrollYouLy(newTranslateY, forceScroll = false, scrollDuration = undefined) {
|
|
2484
2493
|
if (!this.lyricsContainer)
|
|
2485
2494
|
return;
|
|
2486
2495
|
const parent = this.lyricsContainer;
|
|
@@ -2561,11 +2570,12 @@ class AmLyrics extends i {
|
|
|
2561
2570
|
if (i >= referenceIndex)
|
|
2562
2571
|
delayCounter += 1;
|
|
2563
2572
|
const delay = i >= referenceIndex ? (delayCounter - 1) * delayIncrement : 0;
|
|
2573
|
+
const duration = scrollDuration ?? SCROLL_ANIMATION_DURATION_MS;
|
|
2564
2574
|
line.style.setProperty('--scroll-delta', `${delta}px`);
|
|
2565
2575
|
line.style.setProperty('--lyrics-line-delay', `${delay}ms`);
|
|
2566
|
-
line.style.setProperty('--scroll-duration', `${
|
|
2576
|
+
line.style.setProperty('--scroll-duration', `${duration}ms`);
|
|
2567
2577
|
newAnimatingLines.push(line);
|
|
2568
|
-
const lineDuration =
|
|
2578
|
+
const lineDuration = duration + delay;
|
|
2569
2579
|
if (lineDuration > maxAnimationDuration) {
|
|
2570
2580
|
maxAnimationDuration = lineDuration;
|
|
2571
2581
|
}
|
|
@@ -2580,13 +2590,13 @@ class AmLyrics extends i {
|
|
|
2580
2590
|
animatingLines.push(line);
|
|
2581
2591
|
}
|
|
2582
2592
|
animState.isAnimating = true;
|
|
2583
|
-
const BASE_DURATION = SCROLL_ANIMATION_DURATION_MS;
|
|
2593
|
+
const BASE_DURATION = scrollDuration ?? SCROLL_ANIMATION_DURATION_MS;
|
|
2584
2594
|
this.scrollUnlockTimeout = setTimeout(() => {
|
|
2585
2595
|
animState.isAnimating = false;
|
|
2586
2596
|
if (animState.pendingUpdate !== null) {
|
|
2587
2597
|
const pendingValue = animState.pendingUpdate;
|
|
2588
2598
|
animState.pendingUpdate = null;
|
|
2589
|
-
this.animateScrollYouLy(pendingValue, false);
|
|
2599
|
+
this.animateScrollYouLy(pendingValue, false, scrollDuration);
|
|
2590
2600
|
}
|
|
2591
2601
|
}, BASE_DURATION);
|
|
2592
2602
|
this.scrollAnimationTimeout = setTimeout(() => {
|
|
@@ -2647,7 +2657,7 @@ class AmLyrics extends i {
|
|
|
2647
2657
|
/**
|
|
2648
2658
|
* Scroll to active line with YouLyPlus-style animation
|
|
2649
2659
|
*/
|
|
2650
|
-
scrollToActiveLineYouLy(activeLine, forceScroll = false) {
|
|
2660
|
+
scrollToActiveLineYouLy(activeLine, forceScroll = false, scrollDuration = undefined) {
|
|
2651
2661
|
if (!activeLine || !this.lyricsContainer)
|
|
2652
2662
|
return;
|
|
2653
2663
|
const paddingTop = this.getScrollPaddingTop();
|
|
@@ -2675,10 +2685,11 @@ class AmLyrics extends i {
|
|
|
2675
2685
|
clearTimeout(this.userScrollTimeoutId);
|
|
2676
2686
|
this.userScrollTimeoutId = undefined;
|
|
2677
2687
|
}
|
|
2688
|
+
const duration = scrollDuration ?? SCROLL_ANIMATION_DURATION_MS;
|
|
2678
2689
|
setTimeout(() => {
|
|
2679
2690
|
this.isProgrammaticScroll = false;
|
|
2680
|
-
},
|
|
2681
|
-
this.animateScrollYouLy(targetTranslateY, forceScroll);
|
|
2691
|
+
}, duration + 160);
|
|
2692
|
+
this.animateScrollYouLy(targetTranslateY, forceScroll, scrollDuration);
|
|
2682
2693
|
}
|
|
2683
2694
|
/**
|
|
2684
2695
|
* Update syllable highlight animation - apply CSS wipe animation
|
|
@@ -3314,13 +3325,13 @@ class AmLyrics extends i {
|
|
|
3314
3325
|
}
|
|
3315
3326
|
else {
|
|
3316
3327
|
isGrowableVW =
|
|
3317
|
-
combinedDuration >=
|
|
3328
|
+
combinedDuration >= 850 && combinedDuration >= wordLen * 200;
|
|
3318
3329
|
}
|
|
3319
3330
|
}
|
|
3320
3331
|
// Glow requirement (more strict)
|
|
3321
3332
|
const isGlowingVW = isGrowableVW &&
|
|
3322
|
-
combinedDuration >=
|
|
3323
|
-
combinedDuration >= combinedText.length *
|
|
3333
|
+
combinedDuration >= 1000 &&
|
|
3334
|
+
combinedDuration >= combinedText.length * 250;
|
|
3324
3335
|
let charOff = 0;
|
|
3325
3336
|
for (let gi = vwStart; gi <= vwEnd; gi += 1) {
|
|
3326
3337
|
groupGrowable[gi] = isGrowableVW;
|
|
@@ -3890,14 +3901,16 @@ AmLyrics.styles = i$3 `
|
|
|
3890
3901
|
|
|
3891
3902
|
.background-vocal-container {
|
|
3892
3903
|
max-height: 0;
|
|
3893
|
-
padding-top: 0
|
|
3904
|
+
padding-top: 0;
|
|
3905
|
+
transform: translateY(-0.5em) scale(0.95);
|
|
3894
3906
|
overflow: visible;
|
|
3895
3907
|
opacity: 0;
|
|
3896
3908
|
font-size: var(--lyplus-font-size-subtext);
|
|
3897
3909
|
transition:
|
|
3898
|
-
max-height
|
|
3899
|
-
opacity
|
|
3900
|
-
|
|
3910
|
+
max-height 450ms cubic-bezier(0.33, 1, 0.68, 1),
|
|
3911
|
+
opacity 400ms ease-out,
|
|
3912
|
+
transform 450ms cubic-bezier(0.33, 1, 0.68, 1),
|
|
3913
|
+
padding 450ms cubic-bezier(0.33, 1, 0.68, 1);
|
|
3901
3914
|
margin: 0;
|
|
3902
3915
|
}
|
|
3903
3916
|
|
|
@@ -3905,11 +3918,14 @@ AmLyrics.styles = i$3 `
|
|
|
3905
3918
|
.lyrics-line.pre-active .background-vocal-container {
|
|
3906
3919
|
max-height: 4em;
|
|
3907
3920
|
opacity: 1;
|
|
3921
|
+
padding-top: 0.2em;
|
|
3922
|
+
transform: translateY(0) scale(1);
|
|
3908
3923
|
transition:
|
|
3909
|
-
max-height
|
|
3910
|
-
opacity
|
|
3911
|
-
|
|
3912
|
-
|
|
3924
|
+
max-height 450ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
3925
|
+
opacity 400ms ease-out,
|
|
3926
|
+
transform 450ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
3927
|
+
padding 450ms cubic-bezier(0.22, 1, 0.36, 1);
|
|
3928
|
+
will-change: max-height, opacity, padding, transform;
|
|
3913
3929
|
}
|
|
3914
3930
|
|
|
3915
3931
|
/* --- Line States & Modifiers --- */
|
|
@@ -4241,49 +4257,35 @@ AmLyrics.styles = i$3 `
|
|
|
4241
4257
|
INSTRUMENTAL GAP STYLES
|
|
4242
4258
|
========================================================================== */
|
|
4243
4259
|
.lyrics-gap {
|
|
4244
|
-
max-height:
|
|
4245
|
-
padding:
|
|
4246
|
-
overflow:
|
|
4260
|
+
max-height: 1.6em;
|
|
4261
|
+
padding: var(--lyplus-padding-gap);
|
|
4262
|
+
overflow: visible;
|
|
4247
4263
|
opacity: 0;
|
|
4248
4264
|
box-sizing: content-box;
|
|
4249
4265
|
background-clip: unset;
|
|
4250
4266
|
transform-origin: top;
|
|
4251
4267
|
transition:
|
|
4252
|
-
padding 220ms cubic-bezier(0.33, 1, 0.68, 1),
|
|
4253
|
-
max-height 220ms cubic-bezier(0.33, 1, 0.68, 1),
|
|
4254
4268
|
opacity 160ms ease-out,
|
|
4255
4269
|
transform var(--scroll-duration, 280ms) var(--lyrics-line-delay, 0ms);
|
|
4256
4270
|
}
|
|
4257
4271
|
|
|
4258
4272
|
.lyrics-gap.active {
|
|
4259
|
-
max-height: 1.6em;
|
|
4260
|
-
padding: var(--lyplus-padding-gap);
|
|
4261
4273
|
opacity: 1;
|
|
4262
|
-
overflow: visible;
|
|
4263
4274
|
transition:
|
|
4264
|
-
padding 220ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
4265
|
-
max-height 220ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
4266
4275
|
opacity 160ms ease-out,
|
|
4267
4276
|
transform var(--scroll-duration, 280ms);
|
|
4268
|
-
will-change:
|
|
4277
|
+
will-change: opacity;
|
|
4269
4278
|
}
|
|
4270
4279
|
|
|
4271
4280
|
/* Exiting state: quickly collapse width and height so dots don't distort page, or remove max-height transition */
|
|
4272
4281
|
.lyrics-gap.gap-exiting {
|
|
4273
|
-
|
|
4274
|
-
|
|
4275
|
-
opacity: 0;
|
|
4276
|
-
overflow: visible;
|
|
4277
|
-
transition:
|
|
4278
|
-
padding var(--gap-exit-duration, 360ms) cubic-bezier(0.33, 1, 0.68, 1),
|
|
4279
|
-
max-height var(--gap-exit-duration, 360ms)
|
|
4280
|
-
cubic-bezier(0.33, 1, 0.68, 1),
|
|
4281
|
-
opacity 160ms ease-out,
|
|
4282
|
-
transform var(--scroll-duration, 280ms);
|
|
4282
|
+
opacity: 1;
|
|
4283
|
+
transition: transform var(--scroll-duration, 280ms);
|
|
4283
4284
|
}
|
|
4284
4285
|
|
|
4285
4286
|
.lyrics-gap .main-vocal-container {
|
|
4286
4287
|
transform: translateY(-25%) scale(1) translateZ(0);
|
|
4288
|
+
transition: transform 400ms cubic-bezier(0.22, 1, 0.36, 1);
|
|
4287
4289
|
}
|
|
4288
4290
|
|
|
4289
4291
|
/* Jump animation plays during exit */
|