Smartcraft-Media-Tech/nutty-tools
1
0
Fork 0
mirror of https://github.com/nuttylmao/nutty.gg.git synced 2026-09-19 04:00:59 -04:00
Code Issues Packages Projects Releases Wiki Activity

• Removed all references to 'SetAlbumArtSize()'

Browse Source 
• Added progress info to Simple theme
This commit is contained in:
nutty
2026-07-01 05:04:28 +10:00
parent a39e05147c
commit 1e423ee2fe
7 changed files with 96 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files
now-playing/themes/classic/index.html
+20 -18
View File
@@ -1,26 +1,28 @@
<div id="main-wrapper">
<div id="album-art-container">
<div id="album-art-layer"></div>
<div id="album-art-transition-layer"></div>
</div>
<div id="yet-another-wrapper-yup">
<div id="album-art-container">
<div id="album-art-layer"></div>
<div id="album-art-transition-layer"></div>
</div>
<div id="song-info-container">
<div id="background-layer"></div>
<div id="background-transition-layer"></div>
<div id="song-info-container">
<div id="background-layer"></div>
<div id="background-transition-layer"></div>
<div id="song-info-wrapper">
<div id="track-label" class="text-label">&nbsp;</div>
<div id="artist-label" class="text-label">&nbsp;</div>
<div id="song-info-wrapper">
<div id="track-label" class="text-label">&nbsp;</div>
<div id="artist-label" class="text-label">&nbsp;</div>
<div id="progress-container">
<div id="progress-bar-track">
<div id="progress-bar-fill"></div>
<div></div>
</div>
<div id="progress-container">
<div id="progress-bar-track">
<div id="progress-bar-fill"></div>
<div></div>
</div>
<div id="time-container">
<div id="current-time">0:00</div>
<div id="duration">0:00</div>
<div id="time-container">
<div id="current-time">0:00</div>
<div id="duration">0:00</div>
</div>
</div>
</div>
</div>
now-playing/themes/classic/script.js
+2 -12
View File
@@ -77,7 +77,7 @@ async function ChangeTrack(mediaProps, accentColorPalette) {
// Apply a tint: Use 30% opacity of the accent color + a dark overlay for contrast
// 'rgba(0,0,0,0.6)' ensures the text stays readable
backgroundTransitionLayer.style.backgroundColor = aaccentColorPalette.DarkMuted + "80"; // 80 is 50% opacity in hex
backgroundTransitionLayer.style.backgroundColor = accentColorPalette.DarkMuted + "80"; // 80 is 50% opacity in hex
SetVisibility(true); // Show the overlay for a few seconds if autoHide is enabled
}, 250);
@@ -99,14 +99,4 @@ function SetProgressInfo(timelineProps, currentPositionMs, accentColorPalette) {
progressPercent = Math.min(100, Math.max(0, progressPercent));
progressBarFill.style.width = `${progressPercent}%`;
progressBarFill.style.setProperty('--accent-color', accentColorPalette.LightVibrant);
}
function SetAlbumArtSize() {
const height = songInfoContainer.offsetHeight;
albumArtContainer.style.height = `${height}px`;
albumArtContainer.style.width = `${height}px`;
}
requestAnimationFrame(() => {
SetAlbumArtSize();
});
}
now-playing/themes/classic/style.css
+15 -1
View File
@@ -13,6 +13,7 @@
#album-art-container {
/* 1. Tell it to maintain a 1:1 square ratio */
height: 100%;
aspect-ratio: 1 / 1;
overflow: hidden;
border-radius: var(--border-radius);
@@ -20,6 +21,7 @@
background-size: cover;
background-position: center;
display: var(--show-album-art);
flex-shrink: 0;
}
#album-art-layer,
@@ -45,7 +47,8 @@
#song-info-container {
position: relative;
flex: 1;
flex-grow: 1;
min-width: 0;
display: flex;
flex-direction: column;
justify-content: center;
@@ -54,6 +57,17 @@
box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}
#yet-another-wrapper-yup {
position: relative;
flex: 1;
display: flex;
flex-direction: row;
align-items: center;
overflow: hidden;
gap: 0.5em;
transition: all 0.25s ease-in-out;
}
/* The background now fills the frame */
#background-layer,
#background-transition-layer {