Maywood: Add bg and link color-annotations.

maywood/inc/wpcom-colors.php

@@ -18,30 +18,15 @@ add_color_rule( 'bg', '#FFFFFF', array(
 			.wp-block-pullquote.is-style-solid-color,
 			body .widget_eu_cookie_law_widget #eu-cookie-law.negative', 'color' ),
 
-	/**
-	 * Utility Classes
-	 */
-	// Text-color
-	array( '.has-primary-background-color[class],
-			.has-secondary-background-color[class],
-			.has-foreground-background-color[class],
-			.has-foreground-dark-background-color[class],
-			.has-foreground-light-background-color[class],
-			.has-background-color[class],
-			.has-background-dark-color[class],
-			.has-background-light-color[class]', 'color' ),
-	// Background-color
-	array( '.has-background-background-color[class]', 'background-color' ),
+	// Text-color darkened
+	array( 'hr.wp-block-separator.is-style-dots:before', 'color', '-1' ),
+
 	// Background-color darkened
-	array( '.has-background-dark-background-color[class]', 'background-color', '-1' ),
-	// Background-color lightened
-	array( '.has-background-light-background-color[class]', 'background-color', '+1' ),
+	array( 'body .widget_eu_cookie_law_widget #eu-cookie-law.negative input.accept.has-focus,
+			body .widget_eu_cookie_law_widget #eu-cookie-law.negative input.accept:focus,
+			body .widget_eu_cookie_law_widget #eu-cookie-law.negative input.accept:hover', 'background-color', '-1' ),
 
-	/**
-	 * Grays
-	 * Uses a slightly darker color
-	 */
-	// Border-color
+	// Border-color darkened
 	array( '.wp-block-code,
 			body .widget_eu_cookie_law_widget #eu-cookie-law,
 			input[type="color"],
@@ -62,22 +47,48 @@ add_color_rule( 'bg', '#FFFFFF', array(
 			select,
 			textarea,
 			.site-header > .main-navigation > div > ul > li > .sub-menu', 'border-color', '-1' ),
-	// Border-top-color
+	// Border-top-color darkened
 	array( '.comment-list .children > li,
 			.comment-list > li,
 			.wp-block-pullquote', 'border-top-color', '-1' ),
-	// Border-bottom-color
+	// Border-bottom-color darkened
 	array( '.comment-list,
 			.wp-block-pullquote,
 			hr,
 			hr.wp-block-separator', 'border-bottom-color', '-1' ),
-	// Color
-	array( 'hr.wp-block-separator.is-style-dots:before', 'color', '-1' ),
+
+	/**
+	 * Utility Classes
+	 */
+	// Text-color
+	array( '.has-primary-background-color[class],
+			.has-primary-background-color.has-background-dim[class],
+			.has-secondary-background-color[class],
+			.has-secondary-background-color.has-background-dim[class],
+			.has-foreground-background-color[class],
+			.has-foreground-background-color.has-background-dim[class],
+			.has-foreground-dark-background-color[class],
+			.has-foreground-dark-background-color.has-background-dim[class],
+			.has-foreground-light-background-color[class],
+			.has-foreground-light-background-color.has-background-dim[class],
+			.has-background-color[class],
+			.has-background-dark-color[class],
+			.has-background-light-color[class]', 'color' ),
 	// Background-color
-	array( 'body .widget_eu_cookie_law_widget #eu-cookie-law.negative input.accept.has-focus,
-			body .widget_eu_cookie_law_widget #eu-cookie-law.negative input.accept:focus,
-			body .widget_eu_cookie_law_widget #eu-cookie-law.negative input.accept:hover', '-1' ),
+	array( '.has-background-background-color[class],
+			.has-background-background-color.has-background-dim[class]', 'background-color' ),
 
+	// Text-color darkened
+	array( '.has-background-dark-color[class]', 'color', '-1' ),
+	// Background-color darkened
+	array( '.has-background-dark-background-color[class],
+			.has-foreground-dark-background-color.has-background-dim[class]', 'background-color', '-1' ),
+
+	// Text-color lightened
+	array( '.has-background-light-color[class]', 'color', '+1' ),
+	// Background-color lightened
+	array( '.has-background-light-background-color[class],
+			.has-foreground-light-background-color.has-background-dim[class]', 'background-color', '+1' ),
 
 ), __( 'Background Color' ) );
 
@@ -85,21 +96,6 @@ add_color_rule( 'bg', '#FFFFFF', array(
 // $config-global--color-primary-default
 add_color_rule( 'link', '#897248', array(
 
-	// Background-color
-	array( '.a8c-posts-list-item__featured span,
-			.a8c-posts-list__view-all,
-			.button,
-			.main-navigation #toggle:focus + #toggle-menu,
-			.sticky-post,
-			.wp-block-button__link,
-			.wp-block-file .wp-block-file__button,
-			.wp-block-file__button,
-			.wp-block-pullquote.is-style-solid-color,
-			body .widget_eu_cookie_law_widget #eu-cookie-law input.accept,
-			button,
-			button[data-load-more-btn],
-			input[type="submit"]', 'background-color' ),
-
 	// Text-color
 	array( '.a8c-posts-list .a8c-posts-list-item__title a:active,
 			.a8c-posts-list .a8c-posts-list-item__title a:focus,
@@ -113,15 +109,30 @@ add_color_rule( 'link', '#897248', array(
 			.page-title a:hover,
 			.site-title a:hover,
 			.social-navigation a:hover,
-			.wp-block-button.is-style-outline .wp-block-button__link,
 			.wp-block-button.is-style-outline .wp-block-button__link:active,
-			.wp-block-button.is-style-outline.wp-block-button__link,
+			.wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color),
 			.wp-block-button.is-style-outline.wp-block-button__link:active,
+			.wp-block-button.is-style-outline.wp-block-button__link:not(.has-text-color),
 			.wp-block-newspack-blocks-homepage-articles article .entry-title a,
 			.wp-block-newspack-blocks-homepage-articles article .entry-title a:active,
 			.wp-block-newspack-blocks-homepage-articles article .entry-title a:focus,
 			.wp-block-newspack-blocks-homepage-articles article .entry-title a:hover,
-			a', 'color'),
+			a:not(.has-text-color)', 'color'),
+
+	// Background-color
+	array( '.a8c-posts-list-item__featured span,
+			.a8c-posts-list__view-all,
+			.button,
+			.main-navigation #toggle:focus + #toggle-menu,
+			.sticky-post,
+			.wp-block-button__link,
+			.wp-block-file .wp-block-file__button,
+			.wp-block-file__button,
+			.wp-block-pullquote.is-style-solid-color,
+			body .widget_eu_cookie_law_widget #eu-cookie-law input.accept,
+			button,
+			button[data-load-more-btn],
+			input[type="submit"]', 'background-color' ),
 
 	// Border color left
 	array( '.wp-block-quote', 'border-left-color' ),
@@ -133,10 +144,11 @@ add_color_rule( 'link', '#897248', array(
 	/**
 	 * Utility Classes
 	 */
-	// Background-color
-	array( '.has-primary-background-color[class]', 'background-color' ),
 	// Text-color
 	array( '.has-primary-color[class]', 'color' ),
+	// Background-color
+	array( '.has-primary-background-color[class],
+			.has-primary-background-color.has-background-dim[class]', 'background-color' ),
 
 ), __( 'Link Color' ) );
 

maywood/inc/wpcom-editor-colors.php

@@ -7,47 +7,55 @@
 // $config-global--color-background-default
 add_editor_color_rule( 'bg', '#FFFFFF', array(
 
+	// Text-color
+	array( '.wp-block-pullquote.is-style-solid-color', 'color' ),
 	// Background-color
 	array( '#editor .editor-styles-wrapper,
 			#editor .editor-styles-wrapper .fse-template-part .main-navigation > div > ul > li > .sub-menu', 'background-color' ),
 
-	// Text-color
-	array( '.wp-block-pullquote.is-style-solid-color', 'color' ),
+	// Text-color darkened
+	array( '#editor .editor-styles-wrapper .wp-block-separator.is-style-dots', 'color', '-1' ),
+	// Border-color darkened
+	array( '#editor .editor-styles-wrapper .wp-block-code', 'border-color', '-1' ),
+	// Border-top-color darkened
+	array( '#editor .editor-styles-wrapper .wp-block-pullquote', 'border-top-color', '-1' ),
+	// Border-bottom-color darkened
+	array( '#editor .editor-styles-wrapper .wp-block-pullquote,
+			#editor .editor-styles-wrapper .wp-block-separator', 'border-bottom-color', '-1' ),
 
 	/**
 	 * Utility Classes
 	 */
 	// Text-color
 	array( '#editor .editor-styles-wrapper .has-primary-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-primary-background-color[class],
 			#editor .editor-styles-wrapper .has-secondary-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-secondary-background-color[class],
 			#editor .editor-styles-wrapper .has-foreground-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-foreground-background-color[class],
 			#editor .editor-styles-wrapper .has-foreground-dark-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-foreground-dark-background-color[class],
 			#editor .editor-styles-wrapper .has-foreground-light-background-color[class],
-			#editor .editor-styles-wrapper .has-background-color[class]', 'color' ),
+			#editor .editor-styles-wrapper .wp-block .has-foreground-light-background-color[class],
+			#editor .editor-styles-wrapper .has-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-background-color[class]', 'color' ),
 	// Background-color
-	array( '#editor .editor-styles-wrapper .has-background-background-color[class]', 'background-color' ),
+	array( '#editor .editor-styles-wrapper .has-background-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-background-background-color[class]', 'background-color' ),
+
 	// Text-color darkened
-	array( '#editor .editor-styles-wrapper .has-background-dark-color[class]', 'color', '-1'  ),
+	array( '#editor .editor-styles-wrapper .has-background-dark-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-background-dark-color[class]', 'color', '-1'  ),
 	// Background-color darkened
-	array( '#editor .editor-styles-wrapper .has-background-dark-background-color[class]', 'background-color', '-1' ),
+	array( '#editor .editor-styles-wrapper .has-background-dark-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-background-dark-background-color[class]', 'background-color', '-1' ),
+
 	// Text-color lightened
-	array( '#editor .editor-styles-wrapper .has-background-light-color[class]', 'color', '+1'  ),
+	array( '#editor .editor-styles-wrapper .has-background-light-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-background-light-color[class]', 'color', '+1'  ),
 	// Background-color lightened
-	array( '#editor .editor-styles-wrapper .has-background-light-background-color[class]', 'background-color', '+1' ),
-
-	/**
-	 * Grays
-	 * Uses a slightly darker color
-	 */
-	// Color
-	array( '#editor .editor-styles-wrapper .wp-block-separator.is-style-dots', 'color', '-1' ),
-	// Border-color
-	array( '#editor .editor-styles-wrapper .wp-block-code', 'border-color', '-1' ),
-	// Border-top-color
-	array( '#editor .editor-styles-wrapper .wp-block-pullquote', 'border-top-color', '-1' ),
-	// Border-bottom-color
-	array( '#editor .editor-styles-wrapper .wp-block-pullquote,
-			#editor .editor-styles-wrapper .wp-block-separator', 'border-bottom-color', '-1' ),
+	array( '#editor .editor-styles-wrapper .has-background-light-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-background-light-background-color[class]', 'background-color', '+1' ),
 
 ), __( 'Background Color' ) );
 
@@ -55,6 +63,13 @@ add_editor_color_rule( 'bg', '#FFFFFF', array(
 // $config-global--color-primary-default
 add_editor_color_rule( 'link', '#897248', array(
 
+	// Text-color
+	array( '#editor .editor-styles-wrapper .fse-template-part .main-navigation a:hover,
+			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts .entry-title a,
+			#editor .editor-styles-wrapper .is-style-outline .wp-block-button__link,
+			#editor .editor-styles-wrapper .wp-block-button__link.is-style-outline,
+			#editor .editor-styles-wrapper a', 'color' ),
+
 	// Background-color
 	array( '#editor .editor-styles-wrapper .button,
 			#editor .editor-styles-wrapper .fse-template-part .main-navigation #toggle:focus + #toggle-menu,
@@ -63,13 +78,6 @@ add_editor_color_rule( 'link', '#897248', array(
 			#editor .editor-styles-wrapper .wp-block-button__link,
 			#editor .editor-styles-wrapper .wp-block-pullquote.is-style-solid-color', 'background-color' ),
 
-	// Text-color
-	array( '#editor .editor-styles-wrapper .fse-template-part .main-navigation a:hover,
-			#editor .editor-styles-wrapper .is-style-outline .wp-block-button__link,
-			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts .entry-title a,
-			#editor .editor-styles-wrapper .wp-block-button__link.is-style-outline,
-			#editor .editor-styles-wrapper a', 'color' ),
-
 	// Border color left
 	array( '#editor .editor-styles-wrapper .wp-block-quote', 'border-left-color' ),
 
@@ -80,10 +88,12 @@ add_editor_color_rule( 'link', '#897248', array(
 	/**
 	 * Utility Classes
 	 */
-	// Background-color
-	array( '#editor .editor-styles-wrapper .has-primary-background-color[class]', 'background-color' ),
 	// Text-color
-	array( '#editor .editor-styles-wrapper .has-primary-color[class]', 'color' ),
+	array( '#editor .editor-styles-wrapper .has-primary-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-primary-color[class]', 'color' ),
+	// Background-color
+	array( '#editor .editor-styles-wrapper .has-primary-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-primary-background-color[class]', 'background-color' ),
 
 ), __( 'Link Color' ) );