mirror of
https://github.com/meowarex/TidaLuna-Plugins.git
synced 2026-06-18 03:43:10 +10:00
Merge pull request #53 from meowarex/dev
Updated for Sidebar 3.0 + Fixed Image Radius + Fixed Header Clipping
This commit is contained in:
Meow Meow
+2
-1
@@ -1,2 +1,3 @@
|
||||
node_modules/
|
||||
dist/
|
||||
dist/
|
||||
Notes.md
|
||||
Submodule
+1
Submodule Reference/luna-plugins added at 29204beb93
@@ -0,0 +1,9 @@
|
||||
{
|
||||
"linter": {
|
||||
"rules": {
|
||||
"complexity": {
|
||||
"useArrowFunction": "off"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -6,6 +6,15 @@
|
||||
}
|
||||
*/
|
||||
|
||||
/* Rounded corners for various elements */
|
||||
[class*="_thumbnail_"],
|
||||
[class*="_imageWrapper_"],
|
||||
[class*="_coverImage_"],
|
||||
[class*="_overlayIconWrapperAlbum_"],
|
||||
[class*="_playButton_"] {
|
||||
border-radius: 10px !important;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
@@ -256,8 +265,9 @@ button[data-test="close-now-playing"]:hover {
|
||||
}
|
||||
|
||||
[class^="__NEPTUNE_PAGE"],
|
||||
[data-test="main"] {
|
||||
margin-top: 35px;
|
||||
[data-test="main"],
|
||||
.mainContent {
|
||||
margin-top: 5vh !important;
|
||||
}
|
||||
|
||||
[data-test="button-desktop-release-notes"],
|
||||
|
||||
@@ -6,6 +6,15 @@
|
||||
}
|
||||
*/
|
||||
|
||||
/* Rounded corners for various elements */
|
||||
[class*="_thumbnail_"],
|
||||
[class*="_imageWrapper_"],
|
||||
[class*="_coverImage_"],
|
||||
[class*="_overlayIconWrapperAlbum_"],
|
||||
[class*="_playButton_"] {
|
||||
border-radius: 10px !important;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
@@ -356,8 +365,9 @@ button[data-test="close-now-playing"]:hover {
|
||||
}
|
||||
|
||||
[class^="__NEPTUNE_PAGE"],
|
||||
[data-test="main"] {
|
||||
margin-top: 35px;
|
||||
[data-test="main"],
|
||||
.mainContent {
|
||||
margin-top: 5vh !important;
|
||||
}
|
||||
|
||||
[data-test="button-desktop-release-notes"],
|
||||
|
||||
@@ -6,6 +6,15 @@
|
||||
}
|
||||
*/
|
||||
|
||||
/* Rounded corners for various elements */
|
||||
[class*="_thumbnail_"],
|
||||
[class*="_imageWrapper_"],
|
||||
[class*="_coverImage_"],
|
||||
[class*="_overlayIconWrapperAlbum_"],
|
||||
[class*="_playButton_"] {
|
||||
border-radius: 10px !important;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
@@ -182,8 +191,9 @@
|
||||
}
|
||||
|
||||
[class^="__NEPTUNE_PAGE"],
|
||||
[data-test="main"] {
|
||||
margin-top: 35px;
|
||||
[data-test="main"],
|
||||
.mainContent {
|
||||
margin-top: 5vh !important;
|
||||
}
|
||||
|
||||
#playQueueSidebar {
|
||||
|
||||
@@ -33,6 +33,9 @@ if (settings.lyricsGlowEnabled) {
|
||||
lyricsGlowStyleTag.css = lyricsGlow;
|
||||
}
|
||||
|
||||
// Apply base styles always (contains global fixes and conditional UI hiding styles)
|
||||
baseStyleTag.css = baseStyles;
|
||||
|
||||
// Update CSS variables for lyrics text glow based on settings
|
||||
const updateRadiantLyricsTextGlow = function (): void {
|
||||
const root = document.documentElement;
|
||||
@@ -43,8 +46,7 @@ const updateRadiantLyricsTextGlow = function (): void {
|
||||
// Function to update styles when settings change
|
||||
const updateRadiantLyricsStyles = function (): void {
|
||||
if (isHidden) {
|
||||
// Apply only base styles (button hiding) and optional player bar hiding
|
||||
baseStyleTag.css = baseStyles;
|
||||
// Apply optional player bar hiding
|
||||
if (!settings.playerBarVisible) {
|
||||
playerBarStyleTag.css = playerBarHidden;
|
||||
} else {
|
||||
@@ -195,7 +197,6 @@ const toggleRadiantLyrics = function (): void {
|
||||
setTimeout(() => {
|
||||
if (!isHidden) {
|
||||
lyricsStyleTag.remove();
|
||||
baseStyleTag.remove();
|
||||
playerBarStyleTag.remove();
|
||||
}
|
||||
}, 500);
|
||||
|
||||
@@ -1,245 +1,36 @@
|
||||
/* Sidebar with dynamic hash */
|
||||
[class*="_sidebar_"] {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
/* Section header with dynamic hash */
|
||||
[class*="_sectionHeader_"] {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
/* Rounded corners for various elements */
|
||||
[class*="_thumbnail_"],
|
||||
[class*="_imageWrapper_"],
|
||||
[class*="_coverImage_"],
|
||||
[class*="_overlayIconWrapperAlbum_"],
|
||||
[class*="_playButton_"] {
|
||||
border-radius: 10px !important;
|
||||
}
|
||||
|
||||
/* Only apply styles when UI is hidden */
|
||||
.radiant-lyrics-ui-hidden [class*="tabItems"] {
|
||||
opacity: 0 !important;
|
||||
transition: opacity 0.4s ease-in-out;
|
||||
}
|
||||
|
||||
/* Default state - visible */
|
||||
[class*="tabItems"] {
|
||||
transition: opacity 0.4s ease-in-out;
|
||||
}
|
||||
|
||||
/* Tab items stay hidden - no hover functionality (if the song changes and it doesnt have lyrics.. and ya want them back.. you can unhide the UI <3) */
|
||||
|
||||
.radiant-lyrics-ui-hidden
|
||||
[data-test="header-container"]:not(.rl-header-has-hide-btn) {
|
||||
opacity: 0 !important;
|
||||
transition: opacity 0.4s ease-in-out;
|
||||
}
|
||||
|
||||
/* Keep header visible if it contains the Hide UI button, but hide its other children */
|
||||
.radiant-lyrics-ui-hidden [data-test="header-container"].rl-header-has-hide-btn
|
||||
> *:not(.hide-ui-button) {
|
||||
opacity: 0 !important;
|
||||
transition: opacity 0.4s ease-in-out;
|
||||
}
|
||||
|
||||
/* Default state for header */
|
||||
[data-test="header-container"] {
|
||||
transition: opacity 0.4s ease-in-out;
|
||||
}
|
||||
|
||||
/* Only prevent specific text elements in player bar from being affected by margin adjustments */
|
||||
[data-test="footer-player"] [class*="_trackTitle"],
|
||||
[data-test="footer-player"] [class*="_artistName"],
|
||||
[data-test="footer-player"] [class*="_trackInfo"],
|
||||
[data-test="footer-player"] [class*="_trackContainer"] {
|
||||
margin-top: 0 !important;
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
/* Immediate hide class for unhide button with smooth transition (had issues with the fade out.. so I removed it) */
|
||||
/* Immediate hide class for unhide button */
|
||||
.hide-immediately {
|
||||
opacity: 0 !important;
|
||||
visibility: hidden !important;
|
||||
pointer-events: none !important;
|
||||
}
|
||||
|
||||
[class^="_bar"] {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.radiant-lyrics-ui-hidden [class^="_bar"] > *:not(.hide-ui-button) {
|
||||
opacity: 0 !important;
|
||||
pointer-events: none !important;
|
||||
transition: opacity 0.4s ease-in-out;
|
||||
}
|
||||
|
||||
/* Default state for bar elements */
|
||||
[class^="_bar"] > * {
|
||||
transition: opacity 0.4s ease-in-out;
|
||||
}
|
||||
|
||||
/* Hide search box and make it non-interactive */
|
||||
.radiant-lyrics-ui-hidden [data-test="search-input"],
|
||||
.radiant-lyrics-ui-hidden [class*="_searchInput"],
|
||||
.radiant-lyrics-ui-hidden [class*="searchInput"],
|
||||
.radiant-lyrics-ui-hidden [class*="_search"],
|
||||
.radiant-lyrics-ui-hidden [class*="search"],
|
||||
.radiant-lyrics-ui-hidden input[type="search"],
|
||||
.radiant-lyrics-ui-hidden input[type="text"],
|
||||
.radiant-lyrics-ui-hidden input[placeholder*="Search"],
|
||||
.radiant-lyrics-ui-hidden input[placeholder*="search"],
|
||||
.radiant-lyrics-ui-hidden [placeholder*="Search"],
|
||||
.radiant-lyrics-ui-hidden [data-test="main-layout-header"] input,
|
||||
.radiant-lyrics-ui-hidden [data-test="main-layout-header"] [class*="input"],
|
||||
.radiant-lyrics-ui-hidden header input,
|
||||
.radiant-lyrics-ui-hidden nav input {
|
||||
pointer-events: none !important;
|
||||
cursor: default !important;
|
||||
user-select: none !important;
|
||||
}
|
||||
|
||||
/* Hide bottom left controls completely - no hover functionality */
|
||||
/* Exclude heart button in player bar and make sure hidden buttons can't be clicked */
|
||||
.radiant-lyrics-ui-hidden
|
||||
[data-test="add-to-playlist"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden
|
||||
[data-test="remove-from-playlist"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden
|
||||
[data-test="like-toggle"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden
|
||||
[data-test="dislike-toggle"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden
|
||||
[data-test="favorite-toggle"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden
|
||||
[data-test="heart-button"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden
|
||||
[data-test="playlist-add"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden [class*="_trackActions"],
|
||||
.radiant-lyrics-ui-hidden [class*="_bottomLeftControls"],
|
||||
.radiant-lyrics-ui-hidden [class*="_actionButtons"],
|
||||
.radiant-lyrics-ui-hidden
|
||||
[class*="_favoriteButton"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden [class*="_addToPlaylist"],
|
||||
.radiant-lyrics-ui-hidden [class*="_lowerLeft"],
|
||||
.radiant-lyrics-ui-hidden [class*="_bottomActions"],
|
||||
.radiant-lyrics-ui-hidden [class*="_mediaControls"] > div:first-child,
|
||||
.radiant-lyrics-ui-hidden
|
||||
button[title*="Add to"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden
|
||||
button[title*="Remove from"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden
|
||||
button[title*="Like"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden
|
||||
button[title*="Favorite"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden
|
||||
button[title*="Heart"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden
|
||||
button[aria-label*="Add to"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden
|
||||
button[aria-label*="Remove from"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden
|
||||
button[aria-label*="Like"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden
|
||||
button[aria-label*="Favorite"]:not([data-test="footer-player"] *),
|
||||
.radiant-lyrics-ui-hidden
|
||||
button[aria-label*="Heart"]:not([data-test="footer-player"] *),
|
||||
/* Target buttons in bottom left area specifically - (idk if this is needed.. but it's here) */
|
||||
.radiant-lyrics-ui-hidden [class*="_nowPlayingContainer"]
|
||||
button[class*="_button"]:not(.unhide-ui-button),
|
||||
.radiant-lyrics-ui-hidden
|
||||
[class*="_nowPlayingContainer"]
|
||||
[class*="_iconButton"]:not(.unhide-ui-button),
|
||||
/* Additional catch-all for bottom left area buttons - (idk if this is needed.. but it's here) */
|
||||
.radiant-lyrics-ui-hidden [class*="_nowPlayingContainer"]
|
||||
> div
|
||||
> div:first-child
|
||||
button:not(.unhide-ui-button),
|
||||
.radiant-lyrics-ui-hidden
|
||||
[class*="_nowPlayingContainer"]
|
||||
> div:first-child
|
||||
button:not(.unhide-ui-button) {
|
||||
opacity: 0 !important;
|
||||
pointer-events: none !important;
|
||||
transition: opacity 0.5s ease-in-out !important;
|
||||
}
|
||||
|
||||
/* No hover functionality in Hide UI Mode - buttons stay hidden.. yea thats right, you heard me */
|
||||
|
||||
/* Default state for control buttons */
|
||||
[data-test="add-to-playlist"],
|
||||
[data-test="remove-from-playlist"],
|
||||
[data-test="like-toggle"],
|
||||
[data-test="dislike-toggle"],
|
||||
[data-test="favorite-toggle"],
|
||||
[data-test="heart-button"],
|
||||
[data-test="playlist-add"],
|
||||
[class*="_trackActions"],
|
||||
[class*="_bottomLeftControls"],
|
||||
[class*="_actionButtons"],
|
||||
[class*="_favoriteButton"],
|
||||
[class*="_addToPlaylist"],
|
||||
[class*="_lowerLeft"],
|
||||
[class*="_bottomActions"],
|
||||
[class*="_mediaControls"] > div:first-child,
|
||||
button[title*="Add to"],
|
||||
button[title*="Remove from"],
|
||||
button[title*="Like"],
|
||||
button[title*="Favorite"],
|
||||
button[title*="Heart"],
|
||||
button[aria-label*="Add to"],
|
||||
button[aria-label*="Remove from"],
|
||||
button[aria-label*="Like"],
|
||||
button[aria-label*="Favorite"],
|
||||
button[aria-label*="Heart"],
|
||||
[class*="_nowPlayingContainer"] button[class*="_button"]:not(.unhide-ui-button),
|
||||
[class*="_nowPlayingContainer"] [class*="_iconButton"]:not(.unhide-ui-button),
|
||||
[class*="_nowPlayingContainer"]
|
||||
> div
|
||||
> div:first-child
|
||||
button:not(.unhide-ui-button),
|
||||
[class*="_nowPlayingContainer"]
|
||||
> div:first-child
|
||||
button:not(.unhide-ui-button) {
|
||||
transition: opacity 0.5s ease-in-out;
|
||||
}
|
||||
|
||||
/* Smooth cover art movement when UI is hidden */
|
||||
[class*="_albumImage"],
|
||||
[class*="_coverArt"],
|
||||
figure[class*="_albumImage"] {
|
||||
transition: transform 0.6s ease-in-out;
|
||||
}
|
||||
|
||||
.radiant-lyrics-ui-hidden [class*="_albumImage"],
|
||||
.radiant-lyrics-ui-hidden [class*="_coverArt"],
|
||||
.radiant-lyrics-ui-hidden figure[class*="_albumImage"] {
|
||||
transform: translateX(80px) !important;
|
||||
}
|
||||
|
||||
/* Smooth track info wrapper movement when UI is hidden (Arists & Track Title) */
|
||||
[class*="_infoWrapper"],
|
||||
[class*="_textContainer"] {
|
||||
transition: transform 0.6s ease-in-out;
|
||||
}
|
||||
|
||||
.radiant-lyrics-ui-hidden [class*="_infoWrapper"],
|
||||
.radiant-lyrics-ui-hidden [class*="_textContainer"] {
|
||||
transform: translateX(40px) !important;
|
||||
}
|
||||
|
||||
/* Move parent containers instead of lyrics container directly to preserve gradient fade */
|
||||
[data-test="stream-metadata"],
|
||||
[class*="_rightColumn"],
|
||||
[class*="_rightSide"],
|
||||
[class*="_contentRight"],
|
||||
[class*="_sidePanel"],
|
||||
[class*="_lyricsSection"],
|
||||
[class*="_lyricsWrapper"] {
|
||||
transition: transform 0.6s ease-in-out;
|
||||
}
|
||||
|
||||
.radiant-lyrics-ui-hidden [data-test="stream-metadata"],
|
||||
.radiant-lyrics-ui-hidden [class*="_rightColumn"],
|
||||
.radiant-lyrics-ui-hidden [class*="_rightSide"],
|
||||
.radiant-lyrics-ui-hidden [class*="_contentRight"],
|
||||
.radiant-lyrics-ui-hidden [class*="_sidePanel"],
|
||||
.radiant-lyrics-ui-hidden [class*="_lyricsSection"],
|
||||
.radiant-lyrics-ui-hidden [class*="_lyricsWrapper"] {
|
||||
transform: translateX(60px) translateY(-70px) !important;
|
||||
}
|
||||
|
||||
/* Hide UI button base styling - just the transition */
|
||||
.hide-ui-button {
|
||||
transition:
|
||||
opacity 0.5s ease-in-out,
|
||||
visibility 0.5s ease-in-out,
|
||||
background-color 0.2s ease-in-out,
|
||||
transform 0.2s ease-in-out !important;
|
||||
}
|
||||
|
||||
/* Auto-fade styling for unhide button - (Keeps Text Visible, just not full opacity) | Cheers @Zyhn for the idea*/
|
||||
/* Auto-fade styling for unhide button */
|
||||
.unhide-ui-button.auto-faded {
|
||||
background-color: transparent !important;
|
||||
border-color: transparent !important;
|
||||
@@ -252,10 +43,9 @@ figure[class*="_albumImage"] {
|
||||
border-color 0.8s ease-in-out,
|
||||
box-shadow 0.8s ease-in-out,
|
||||
backdrop-filter 0.8s ease-in-out,
|
||||
color 0.8s ease-in-out;
|
||||
color 0.8s ease-in-out !important;
|
||||
}
|
||||
|
||||
/* Restore button styling on hover */
|
||||
.unhide-ui-button.auto-faded:hover {
|
||||
background-color: rgba(255, 255, 255, 0.2) !important;
|
||||
border-color: rgba(255, 255, 255, 0.3) !important;
|
||||
@@ -268,5 +58,5 @@ figure[class*="_albumImage"] {
|
||||
border-color 0.3s ease-in-out,
|
||||
box-shadow 0.3s ease-in-out,
|
||||
backdrop-filter 0.3s ease-in-out,
|
||||
color 0.3s ease-in-out;
|
||||
color 0.3s ease-in-out !important;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user