Spearhead: Use the background color for sticky posts and menus

seedlet/inc/wpcom-customize-preview.js

@@ -70,6 +70,7 @@ function changeColorLuminescence( hex, amount ) {
 			var secondaryHover = changeColorLuminescence( secondary, 10 );
 			const extraCSS = ':root {' +
 					'--global--color-background: ' + background + ';' +
+					'--global--color-background-high-contrast: ' + background + ';' +
 					'--global--color-foreground: ' + foreground + ';' +
 					'--global--color-foreground-low-contrast: ' + foregroundLowContrast + ';' +
 					'--global--color-foreground-high-contrast: ' + foregroundHighContrast + ';' +

spearhead/inc/wpcom-colors-utils.php

@@ -140,6 +140,7 @@ function seedlet_custom_colors_extra_css() {
 	:root,
 	#editor .editor-styles-wrapper {
 		--global--color-background: <?php echo $background; ?>;
+		--global--color-background-high-contrast: <?php echo $background; ?>;
 		--global--color-foreground: <?php echo $foreground; ?>;
 		--global--color-foreground-low-contrast: <?php echo $foreground_low_contrast; ?>;
 		--global--color-foreground-high-contrast: <?php echo $foreground_high_contrast; ?>;

spearhead/variables.css

@@ -111,9 +111,10 @@
 		--global--color-foreground: #ffffff;
 		--global--color-foreground-low-contrast: #b2b2b2;
 		--global--color-background: #1e1f21;
+		--global--color-background-high-contrast: #2d3139;
 		--global--color-text-selection: #000000;
 		--sticky-posts--color-background: var(--global--color-background);
-		--sticky-posts--alt-color-background: #2d3139;
+		--sticky-posts--alt-color-background: var(--global--color-background-high-contrast);
 		--primary-nav--color-background: var(--sticky-posts--alt-color-background);
 		--primary-nav--dropdown-color-link: var(--global--color-foreground);
 	}