diff --git a/StarryNight/theme.js b/StarryNight/theme.js index af4ee980..a6d854cb 100644 --- a/StarryNight/theme.js +++ b/StarryNight/theme.js @@ -53,48 +53,47 @@ waitForElement(['.Root__top-container'], ([topContainer]) => { // handles resizing of playbar panel to match right sidebar below it const playbar = document.querySelector('.Root__now-playing-bar'); - const rightbar = document.querySelector('.Root__right-sidebar'); - - const resizeObserver = new ResizeObserver((entries) => { - for (const entry of entries) { - if (entry.target === rightbar) { - let newWidth = entry.contentRect.width; - if (newWidth === 0) { - const localStorageWidth = localStorage.getItem( - '223ni6f2epqcidhx5etjafeai:panel-width-saved' - ); - if (localStorageWidth) { - newWidth = localStorageWidth; - } else { - newWidth = 420; + waitForElement(['.Root__right-sidebar'], ([rightbar]) => { + const resizeObserver = new ResizeObserver((entries) => { + for (const entry of entries) { + if (entry.target === rightbar) { + let newWidth = entry.contentRect.width; + if (newWidth === 0) { + const localStorageWidth = localStorage.getItem( + '223ni6f2epqcidhx5etjafeai:panel-width-saved' + ); + if (localStorageWidth) { + newWidth = localStorageWidth; + } else { + newWidth = 420; + } } + playbar.style.width = `${newWidth}px`; + break; } - playbar.style.width = `${newWidth}px`; - break; } - } - }); - - resizeObserver.observe(rightbar); + }); - // start or stop spinning animation based on whether something is playing - const targetElement = document.querySelector('[data-encore-id="buttonPrimary"]'); - - const playObserver = new MutationObserver((mutationsList, observer) => { - for (const mutation of mutationsList) { - if ( - mutation.type === 'attributes' && - mutation.attributeName === 'aria-label' - ) { - handleLabelChange(); + resizeObserver.observe(rightbar); + }); + + waitForElement(['[data-encore-id="buttonPrimary"]'], ([targetElement]) => { + // start or stop spinning animation based on whether something is playing + const playObserver = new MutationObserver((mutationsList) => { + for (const mutation of mutationsList) { + if ( + mutation.type === 'attributes' && + mutation.attributeName === 'aria-label' + ) { + handleLabelChange(); + } } - } + }); + + const playConfig = { attributes: true, attributeFilter: ['aria-label'] }; + playObserver.observe(targetElement, playConfig); }); - const playConfig = { attributes: true, attributeFilter: ['aria-label'] }; - - playObserver.observe(targetElement, playConfig); - function handleLabelChange() { const img = document.querySelector( '.main-nowPlayingWidget-coverArt .cover-art img' @@ -139,4 +138,4 @@ waitForElement(['.Root__top-container'], ([topContainer]) => { backgroundContainer.appendChild(shootingstar); } -}); +}); \ No newline at end of file diff --git a/StarryNight/user.css b/StarryNight/user.css index 819bec4a..b2b2bab4 100644 --- a/StarryNight/user.css +++ b/StarryNight/user.css @@ -6,12 +6,9 @@ background-color: #00000000 !important; } -.main-actionBarBackground-background { - background-color: #00000000 !important; -} - .main-home-homeHeader { background-color: #00000000 !important; + background-image: none !important; } .Root__top-container { @@ -27,7 +24,6 @@ "global-nav global-nav global-nav" "left-sidebar main-view now-playing-bar" "left-sidebar main-view right-sidebar" !important; - grid-template-rows: auto 1fr 1fr; } .Root__right-sidebar { @@ -75,15 +71,19 @@ } .main-actionBarBackground-background { - background-image: linear-gradient(rgba(var(--spice-rgb-shadow), .6) 0, #000000 100%), #00000000 !important; + background-image: none; + background-color: #00000000 !important; animation: none !important; -webkit-animation: none !important; } -.main-entityHeader-background.main-entityHeader-overlay { - background-image: none !important; +.main-entityHeader-overlay { + background: none !important; +} + +.main-entityHeader-background.main-entityHeader-gradient { + opacity: 0.5; animation: none !important; - -webkit-animation: none !important; } .main-entityHeader-background.main-entityHeader-overlay:after { @@ -93,7 +93,7 @@ } .pUNc2aOeOQANHrhYa1GU .RDZ61ETnag1ilfZTkVxe { - color: #000000 !important; + color: #00000000 !important; } .playlist-playlist-playlistContent { @@ -122,10 +122,6 @@ background-color: #00000000 !important; } -.main-home-homeHeader { - background-image: linear-gradient(rgba(var(--spice-rgb-shadow), .6) 0, #00000000 100%), var(--background-noise); -} - .main-nowPlayingBar-center { width: 100%; }