mirror of
https://github.com/th-ch/youtube-music.git
synced 2026-01-12 02:51:46 +00:00
8ce91b143a
* Added Plugin File * Added Logic * Known issue * Finished Backend part * Before cleanup * Added Style Removed log * Fixed time and visibility issues * Changed lyrics style * Changed way lyrics are selected * Fix * Added style lyrics options * Cleanup * Fix lyrics styling Changed how lyrics status are changed * Moved code to make file more readable * Change Tab Size * Fixed issue with overlapping lyrics * Removed debug console.log * Added style adaptation for music videos * Changed file indent * Revered back to original pnpm file * Removed unnecessary option * Fix lyrics status bug Removed leftover logs * Started to implement fetching for genius lyrics * feat(synced-lyrics): add `addedVersion` field * Made changes according to feedbacks * fix: add a delay of 300ms to the current time - Since the transition takes 300ms, we need to add a delay of 300ms to the current time * Removed test about genius.com scraping * Removed 300ms delay * chore: cleaned up the code * Specified path and variable * chore: always enable lyrics tab * chore: use SolidJS to render the lyrics * chore: remove useless signal * chore: feature-parity with original PR (+some nice stuff) * recreate lock file * show json decode error * feat(synced-lyrics): improve ui - Change type assertion code - Replace span to `yt-formatted-string` - Add refetch button * chore: make the lyric styling a solidjs effect * feat: i18n * chore: apply suggestion --------- Co-authored-by: Su-Yong <simssy2205@gmail.com> Co-authored-by: JellyBrick <shlee1503@naver.com> Co-authored-by: Angelos Bouklis <53124886+ArjixWasTaken@users.noreply.github.com>
79 lines
1.6 KiB
CSS
79 lines
1.6 KiB
CSS
/* Hides the original lyrics, to only show our own. */
|
|
#tab-renderer[page-type='MUSIC_PAGE_TYPE_TRACK_LYRICS'] > * {
|
|
display: none !important;
|
|
}
|
|
|
|
#tab-renderer[page-type='MUSIC_PAGE_TYPE_TRACK_LYRICS'] > #synced-lyrics-container {
|
|
display: block !important;
|
|
}
|
|
|
|
/* :root {
|
|
--ytmusic-text-primary: #fff;
|
|
--ytmusic-text-secondary: #aaa;
|
|
} */
|
|
|
|
:root {
|
|
--global-margin: 0.7rem;
|
|
--previous-lyrics: var(--ytmusic-text-primary);
|
|
--current-lyrics: var(--ytmusic-text-primary);
|
|
--upcoming-lyrics: var(--ytmusic-text-secondary);
|
|
--size-lyrics: 1.2em;
|
|
--offset-lyrics: 1em;
|
|
}
|
|
|
|
.lyric-container {
|
|
padding-top: 16px;
|
|
}
|
|
|
|
.description {
|
|
font-size: clamp(1.4rem, 1.1vmax, 3rem) !important;
|
|
text-align: left !important;
|
|
}
|
|
|
|
.synced-line {
|
|
width: var(--lyric-width, 100%);
|
|
}
|
|
|
|
.synced-line > .text-lyrics {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.synced-lyrics {
|
|
display: block;
|
|
justify-content: left;
|
|
text-align: left;
|
|
margin: 0.5rem 0;
|
|
margin-right: 20px;
|
|
transition: all 0.3s ease-in-out;
|
|
}
|
|
|
|
.warning-lyrics {
|
|
color: var(--ytmusic-text-secondary) !important;
|
|
font-style: italic;
|
|
}
|
|
|
|
.text-lyrics {
|
|
display: block;
|
|
text-align: left;
|
|
margin: var(--global-margin) 0;
|
|
transition: scale 0.3s ease-in-out, translate 0.3s ease-in-out, color 0.1s ease-in-out;
|
|
transform-origin: 0 50%;
|
|
}
|
|
|
|
.previous > .text-lyrics {
|
|
color: var(--previous-lyrics);
|
|
font-weight: normal;
|
|
}
|
|
|
|
.current > .text-lyrics {
|
|
color: var(--current-lyrics);
|
|
font-weight: bold;
|
|
scale: var(--size-lyrics);
|
|
translate: var(--offset-lyrics) 0;
|
|
}
|
|
|
|
.upcoming > .text-lyrics {
|
|
color: var(--upcoming-lyrics);
|
|
font-weight: normal;
|
|
}
|