Merge pull request #2322 from raszpl/patch-3

Update styles.css Shorts Background
code-charity · May 31, 2024 · e653ff6 · e653ff6
2 parents e57bfc2 + 0a4e805
commit e653ff6
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 2 deletions.
diff --git a/js&css/extension/www.youtube.com/styles.css b/js&css/extension/www.youtube.com/styles.css
@@ -739,6 +739,7 @@ html[it-theme=black][data-system-color-scheme=light][it-schedule=system_peferenc
 	--yt-spec-selected-nav-text: #aaa !important;
 	--yt-spec-themed-blue: #065fd4 !important;
 	--yt-spec-themed-green: #107516 !important;
+	background-color: var(--yt-spec-base-background)!important;
 }
 
 html[it-theme=black]:not([it-schedule=system_peference_dark]):not([it-schedule=system_peference_light]) #yt-masthead-logo-fragment .masthead-logo-renderer-logo,
@@ -971,6 +972,7 @@ html[it-theme=dawn][data-system-color-scheme=light][it-schedule=system_peference
 	--yt-spec-selected-nav-text: rgb(255, 255, 255) !important;
 	--yt-spec-themed-blue: #065fd4 !important;
 	--yt-spec-themed-green: #107516 !important;
+	background-color: var(--yt-spec-base-background)!important;
 }
 
 html[it-theme=dawn]:not([it-schedule=system_peference_dark]):not([it-schedule=system_peference_light]) ytd-masthead,
@@ -1206,6 +1208,7 @@ html[it-theme=desert][data-system-color-scheme=light][it-schedule=system_peferen
 	--yt-spec-selected-nav-text: #555 !important;
 	--yt-spec-themed-blue: #065fd4 !important;
 	--yt-spec-themed-green: #107516 !important;
+	background-color: var(--yt-spec-base-background)!important;
 }
 
 html[it-theme=desert]:not([it-schedule=system_peference_dark]):not([it-schedule=system_peference_light]) ytd-masthead,
@@ -1426,6 +1429,7 @@ html[it-theme=night][data-system-color-scheme=light][it-schedule=system_peferenc
 	--yt-spec-selected-nav-text: #fff !important;
 	--yt-spec-themed-blue: #065fd4 !important;
 	--yt-spec-themed-green: #107516 !important;
+	background-color: var(--yt-spec-base-background)!important;
 }
 
 html[it-theme=night]:not([it-schedule=system_peference_dark]):not([it-schedule=system_peference_light]) #yt-masthead-logo-fragment .masthead-logo-renderer-logo,
@@ -1660,6 +1664,7 @@ html[it-theme=plain][data-system-color-scheme=light][it-schedule=system_peferenc
 	--yt-spec-selected-nav-text: #666 !important;
 	--yt-spec-themed-blue: #065fd4 !important;
 	--yt-spec-themed-green: #107516 !important;
+	background-color: var(--yt-spec-base-background)!important;
 }
 
 html[it-theme=plain]:not([it-schedule=system_peference_dark]):not([it-schedule=system_peference_light]) ytd-masthead,
@@ -1890,6 +1895,7 @@ html[it-theme=sunset][data-system-color-scheme=light][it-schedule=system_peferen
 	--yt-spec-selected-nav-text: #fff !important;
 	--yt-spec-themed-blue: #065fd4 !important;
 	--yt-spec-themed-green: #107516 !important;
+	background-color: var(--yt-spec-base-background)!important;
 }
 
 html[it-theme=sunset]:not([it-schedule=system_peference_dark]):not([it-schedule=system_peference_light]) ytd-masthead,

diff --git a/js&css/web-accessible/www.youtube.com/themes.js b/js&css/web-accessible/www.youtube.com/themes.js
@@ -67,6 +67,7 @@ ImprovedTube.myColors = function () {
 					'--yt-spec-inverted-background: #fff;' +
 					'--ytd-searchbox-background:' + primary_color + '!important;' +
 					'--ytd-searchbox-legacy-button-color:' + 'var(--yt-spec-brand-background-primary)' + '!important;' +
+					'background-color: var(--yt-spec-base-background)!important;' +
 					'}';
 
 				this.elements.my_colors = style;
@@ -94,19 +95,21 @@ ImprovedTube.setTheme = function () {
 			}
 			this.elements.my_colors?.remove();
 			break
+
 		case 'light':
-			document.documentElement.removeAttribute('dark');
-			document.querySelector('ytd-masthead')?.removeAttribute('dark');
 			ImprovedTube.messages.send({action: 'set', key: 'theme', value: null});
 			ImprovedTube.setPrefCookieValueByName('f6', null);
 			if (document.getElementById("cinematics")) {
 				document.getElementById('cinematics').style.display = 'none !important';
 			}
+			// fall through
 		case 'dawn':
 		case 'sunset':
 		case 'night':
 		case 'plain':
 		case 'desert':
+			document.documentElement.removeAttribute('dark');
+			document.querySelector('ytd-masthead')?.removeAttribute('dark');
 			document.getElementById('cinematics')?.removeAttribute('style');
 			this.elements.my_colors?.remove();
 			break