Merge pull request #2417 from Automattic/seedlet/fix/cleanup-color-rules

Seedlet: Correct nested color rules

seedlet/assets/css/ie.css

@@ -2205,12 +2205,12 @@ object {
 	margin-bottom: 30px;
 }
 
-.wp-block-cover .wp-block-cover__inner-container a,
-.wp-block-cover .wp-block-cover-image-text a,
-.wp-block-cover .wp-block-cover-text a,
-.wp-block-cover-image .wp-block-cover__inner-container a,
-.wp-block-cover-image .wp-block-cover-image-text a,
-.wp-block-cover-image .wp-block-cover-text a {
+.wp-block-cover .wp-block-cover__inner-container a:not(.has-text-color),
+.wp-block-cover .wp-block-cover-image-text a:not(.has-text-color),
+.wp-block-cover .wp-block-cover-text a:not(.has-text-color),
+.wp-block-cover-image .wp-block-cover__inner-container a:not(.has-text-color),
+.wp-block-cover-image .wp-block-cover-image-text a:not(.has-text-color),
+.wp-block-cover-image .wp-block-cover-text a:not(.has-text-color) {
 	color: currentColor;
 }
 
@@ -3803,58 +3803,88 @@ table th {
 	color: black;
 }
 
-.has-background:not(.has-background-background-color) a,
+.has-background:not(.has-background-background-color) a:not(.has-text-color),
 .has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6 {
 	color: currentColor;
 }
 
 .has-primary-background-color[class] {
 	background-color: #000000;
+}
+
+.has-primary-background-color[class]:not(.has-text-color) {
 	color: #FFFFFF;
 }
 
 .has-secondary-background-color[class] {
 	background-color: #3C8067;
+}
+
+.has-secondary-background-color[class]:not(.has-text-color) {
 	color: #FFFFFF;
 }
 
 .has-foreground-background-color[class] {
 	background-color: #333333;
+}
+
+.has-foreground-background-color[class]:not(.has-text-color) {
 	color: #FFFFFF;
 }
 
 .has-foreground-light-background-color[class] {
 	background-color: #444444;
+}
+
+.has-foreground-light-background-color[class]:not(.has-text-color) {
 	color: #FFFFFF;
 }
 
 .has-foreground-dark-background-color[class] {
 	background-color: #000000;
+}
+
+.has-foreground-dark-background-color[class]:not(.has-text-color) {
 	color: #FFFFFF;
 }
 
 .has-tertiary-background-color[class] {
 	background-color: #FAFBF6;
+}
+
+.has-tertiary-background-color[class]:not(.has-text-color) {
 	color: #333333;
 }
 
 .has-background-dark-background-color[class] {
 	background-color: #DDDDDD;
+}
+
+.has-background-dark-background-color[class]:not(.has-text-color) {
 	color: #333333;
 }
 
 .has-background-background-color[class] {
 	background-color: #FFFFFF;
+}
+
+.has-background-background-color[class]:not(.has-text-color) {
 	color: #333333;
 }
 
 .has-white-background-color[class] {
 	background-color: white;
+}
+
+.has-white-background-color[class]:not(.has-text-color) {
 	color: #3C8067;
 }
 
 .has-black-background-color[class] {
 	background-color: black;
+}
+
+.has-black-background-color[class]:not(.has-text-color) {
 	color: #000000;
 }
 

seedlet/assets/css/style-editor.css

@@ -483,14 +483,14 @@ div[data-type="core/button"] {
 	color: currentColor;
 }
 
-.wp-block-cover .wp-block-cover__inner-container a,
-.wp-block-cover .wp-block-cover-image-text a,
-.wp-block-cover .wp-block-cover-text a,
-.wp-block-cover .block-editor-block-list__block a,
-.wp-block-cover-image .wp-block-cover__inner-container a,
-.wp-block-cover-image .wp-block-cover-image-text a,
-.wp-block-cover-image .wp-block-cover-text a,
-.wp-block-cover-image .block-editor-block-list__block a {
+.wp-block-cover .wp-block-cover__inner-container a:not(.has-text-color),
+.wp-block-cover .wp-block-cover-image-text a:not(.has-text-color),
+.wp-block-cover .wp-block-cover-text a:not(.has-text-color),
+.wp-block-cover .block-editor-block-list__block a:not(.has-text-color),
+.wp-block-cover-image .wp-block-cover__inner-container a:not(.has-text-color),
+.wp-block-cover-image .wp-block-cover-image-text a:not(.has-text-color),
+.wp-block-cover-image .wp-block-cover-text a:not(.has-text-color),
+.wp-block-cover-image .block-editor-block-list__block a:not(.has-text-color) {
 	color: currentColor;
 }
 

seedlet/assets/sass/blocks/cover/_editor.scss

@@ -12,7 +12,7 @@
 	.block-editor-block-list__block {
 		color: currentColor; // uses text color specified with background-color options in /blocks/utilities/_style.scss
 
-		a {
+		a:not(.has-text-color) {
 			color: currentColor;
 		}
 		.has-link-color a {

seedlet/assets/sass/blocks/cover/_style.scss

@@ -13,7 +13,7 @@
 		margin-top: var(--global--spacing-vertical);
 		margin-bottom: var(--global--spacing-vertical);
 
-		a {
+		a:not(.has-text-color) {
 			color: currentColor;
 		}
 		.has-link-color a {

seedlet/assets/sass/blocks/utilities/_style.scss

@@ -152,7 +152,7 @@
 
 // Gutenberg background-color options
 .has-background {
-	&:not(.has-background-background-color) a,
+	&:not(.has-background-background-color) a:not(.has-text-color),
 	p, h1, h2, h3, h4, h5, h6 {
 		color: currentColor;
 	}
@@ -160,52 +160,83 @@
 
 .has-primary-background-color[class] {
 	background-color: var(--global--color-primary);
-	color: var(--global--color-background);
+	
+	&:not(.has-text-color) {
+		color: var(--global--color-background);
+	}
 }
 
 .has-secondary-background-color[class] {
 	background-color: var(--global--color-secondary);
-	color: var(--global--color-background);
+
+	&:not(.has-text-color) {
+		color: var(--global--color-background);
+	}
 }
 
 .has-foreground-background-color[class] {
 	background-color: var(--global--color-foreground);
-	color: var(--global--color-background);
+
+	&:not(.has-text-color) {
+		color: var(--global--color-background);
+	}
 }
 
 .has-foreground-light-background-color[class] {
 	background-color: var(--global--color-foreground-light);
-	color: var(--global--color-background);
+
+	&:not(.has-text-color) {
+		color: var(--global--color-background);
+	}
 }
 
+
 .has-foreground-dark-background-color[class] {
 	background-color: var(--global--color-foreground-dark);
-	color: var(--global--color-background);
+
+	&:not(.has-text-color) {
+		color: var(--global--color-background);
+	}
 }
 
 .has-tertiary-background-color[class] {
 	background-color: var(--global--color-tertiary);
-	color: var(--global--color-foreground);
+
+	&:not(.has-text-color) {
+		color: var(--global--color-foreground);
+	}
 }
 
 .has-background-dark-background-color[class] {
 	background-color: var(--global--color-background-dark);
-	color: var(--global--color-foreground);
+
+	&:not(.has-text-color) {
+		color: var(--global--color-foreground);
+	}
 }
 
 .has-background-background-color[class] {
 	background-color: var(--global--color-background);
-	color: var(--global--color-foreground);
+
+	&:not(.has-text-color) {
+		color: var(--global--color-foreground);
+	}
 }
 
 .has-white-background-color[class] {
 	background-color: var(--global--color-white);
-	color: var(--global--color-secondary);
+
+	&:not(.has-text-color) {
+		color: var(--global--color-secondary);
+	}
 }
 
 .has-black-background-color[class] {
 	background-color: var(--global--color-black);
-	color: var(--global--color-primary);
+
+	&:not(.has-text-color) {
+		color: var(--global--color-primary);
+	}
 }
 
 // Gutenberg Font-size options

seedlet/style-rtl.css

@@ -2510,58 +2510,88 @@ table th,
 	color: var(--global--color-black);
 }
 
-.has-background:not(.has-background-background-color) a,
+.has-background:not(.has-background-background-color) a:not(.has-text-color),
 .has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6 {
 	color: currentColor;
 }
 
 .has-primary-background-color[class] {
 	background-color: var(--global--color-primary);
+}
+
+.has-primary-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-background);
 }
 
 .has-secondary-background-color[class] {
 	background-color: var(--global--color-secondary);
+}
+
+.has-secondary-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-background);
 }
 
 .has-foreground-background-color[class] {
 	background-color: var(--global--color-foreground);
+}
+
+.has-foreground-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-background);
 }
 
 .has-foreground-light-background-color[class] {
 	background-color: var(--global--color-foreground-light);
+}
+
+.has-foreground-light-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-background);
 }
 
 .has-foreground-dark-background-color[class] {
 	background-color: var(--global--color-foreground-dark);
+}
+
+.has-foreground-dark-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-background);
 }
 
 .has-tertiary-background-color[class] {
 	background-color: var(--global--color-tertiary);
+}
+
+.has-tertiary-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-foreground);
 }
 
 .has-background-dark-background-color[class] {
 	background-color: var(--global--color-background-dark);
+}
+
+.has-background-dark-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-foreground);
 }
 
 .has-background-background-color[class] {
 	background-color: var(--global--color-background);
+}
+
+.has-background-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-foreground);
 }
 
 .has-white-background-color[class] {
 	background-color: var(--global--color-white);
+}
+
+.has-white-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-secondary);
 }
 
 .has-black-background-color[class] {
 	background-color: var(--global--color-black);
+}
+
+.has-black-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-primary);
 }
 

seedlet/style.css

@@ -1405,12 +1405,12 @@ object {
 	margin-bottom: var(--global--spacing-vertical);
 }
 
-.wp-block-cover .wp-block-cover__inner-container a,
-.wp-block-cover .wp-block-cover-image-text a,
-.wp-block-cover .wp-block-cover-text a,
-.wp-block-cover-image .wp-block-cover__inner-container a,
-.wp-block-cover-image .wp-block-cover-image-text a,
-.wp-block-cover-image .wp-block-cover-text a {
+.wp-block-cover .wp-block-cover__inner-container a:not(.has-text-color),
+.wp-block-cover .wp-block-cover-image-text a:not(.has-text-color),
+.wp-block-cover .wp-block-cover-text a:not(.has-text-color),
+.wp-block-cover-image .wp-block-cover__inner-container a:not(.has-text-color),
+.wp-block-cover-image .wp-block-cover-image-text a:not(.has-text-color),
+.wp-block-cover-image .wp-block-cover-text a:not(.has-text-color) {
 	color: currentColor;
 }
 
@@ -2522,58 +2522,88 @@ table th,
 	color: var(--global--color-black);
 }
 
-.has-background:not(.has-background-background-color) a,
+.has-background:not(.has-background-background-color) a:not(.has-text-color),
 .has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6 {
 	color: currentColor;
 }
 
 .has-primary-background-color[class] {
 	background-color: var(--global--color-primary);
+}
+
+.has-primary-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-background);
 }
 
 .has-secondary-background-color[class] {
 	background-color: var(--global--color-secondary);
+}
+
+.has-secondary-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-background);
 }
 
 .has-foreground-background-color[class] {
 	background-color: var(--global--color-foreground);
+}
+
+.has-foreground-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-background);
 }
 
 .has-foreground-light-background-color[class] {
 	background-color: var(--global--color-foreground-light);
+}
+
+.has-foreground-light-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-background);
 }
 
 .has-foreground-dark-background-color[class] {
 	background-color: var(--global--color-foreground-dark);
+}
+
+.has-foreground-dark-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-background);
 }
 
 .has-tertiary-background-color[class] {
 	background-color: var(--global--color-tertiary);
+}
+
+.has-tertiary-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-foreground);
 }
 
 .has-background-dark-background-color[class] {
 	background-color: var(--global--color-background-dark);
+}
+
+.has-background-dark-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-foreground);
 }
 
 .has-background-background-color[class] {
 	background-color: var(--global--color-background);
+}
+
+.has-background-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-foreground);
 }
 
 .has-white-background-color[class] {
 	background-color: var(--global--color-white);
+}
+
+.has-white-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-secondary);
 }
 
 .has-black-background-color[class] {
 	background-color: var(--global--color-black);
+}
+
+.has-black-background-color[class]:not(.has-text-color) {
 	color: var(--global--color-primary);
 }