move header-background to banner-image section not tracklist

Comfy-Themes · Jun 2, 2024 · 3f0b07f · 3f0b07f
1 parent da392cb
commit 3f0b07f
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 25 deletions.
diff --git a/Comfy/app.scss b/Comfy/app.scss
@@ -21,7 +21,7 @@
 	--cover-art-radius: 8px;
 	--cover-art-left: 0px;
 	--cover-art-bottom: 20px;
-	--tracklist-header-opacity: 0.6;
+	--header-opacity: 0.6;
 	--tracklist-gradient-height: 232px;
 	--tracklist-gradient-opacity: 0.6;
 	--tracklist-gradient-noise: var(--background-noise);

diff --git a/Comfy/assets/_snippets.scss b/Comfy/assets/_snippets.scss
@@ -429,7 +429,7 @@
 			}
 		}
 
-		&.Tracklist-Header-Background {
+		&.Header-Background {
 			.main-entityHeader-imageContainerNew {
 				align-self: center;
 				left: calc(clamp(128px, 128px + (100vw - var(--comfy-left-sidebar-width, 0px) - var(--comfy-panel-width, 0px) - 600px)/424*104, 232px) + 24px + var(--content-spacing));

diff --git a/Comfy/theme.script.js b/Comfy/theme.script.js
@@ -1092,29 +1092,6 @@ todo:
 				}
 			]),
 			Spicetify.React.createElement(Section, { name: "Tracklist", filter }, [
-				{
-					type: SubSection,
-					name: "Tracklist-Header-Background",
-					title: "Header Background",
-					desc: "Adds a translucent background that spans all header text and images (the area above the tracklist)",
-					defaultVal: false,
-					callback: value => {
-						if (!value) {
-							document.documentElement.style.setProperty("--tracklist-header-opacity", "");
-						}
-					},
-					items: [
-						{
-							type: Input,
-							inputType: "number",
-							name: "Tracklist-Header-Background-Opacity",
-							title: "Opacity",
-							defaultVal: "0.6",
-							callback: value => document.documentElement.style.setProperty("--tracklist-header-opacity", value ? value : "")
-						}
-					],
-					collapseItems: false
-				},
 				{
 					type: Slider,
 					name: "Remove-Tracklist-Index",
@@ -1356,6 +1333,29 @@ todo:
 				}
 			]),
 			Spicetify.React.createElement(Section, { name: "Banner Image", filter }, [
+				{
+					type: SubSection,
+					name: "Header-Background",
+					title: "Header Background",
+					desc: "Adds a translucent background behind header text and images",
+					defaultVal: false,
+					callback: value => {
+						if (!value) {
+							document.documentElement.style.setProperty("--header-opacity", "");
+						}
+					},
+					items: [
+						{
+							type: Input,
+							inputType: "number",
+							name: "Header-Background-Opacity",
+							title: "Opacity",
+							defaultVal: "0.6",
+							callback: value => document.documentElement.style.setProperty("--header-opacity", value ? value : "")
+						}
+					],
+					collapseItems: false
+				},
 				{
 					type: SubSection,
 					name: "Banner-Enabled",