Add color support to the quote block (#39899)

WordPress · Apr 13, 2022 · d7ca404 · d7ca404
1 parent 034b25c
commit d7ca404
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 1 deletion.
diff --git a/docs/reference-guides/core-blocks.md b/docs/reference-guides/core-blocks.md
@@ -680,7 +680,7 @@ Give quoted text visual emphasis. "In quoting others, we cite ourselves." — Ju
 
 -	**Name:** core/quote
 -	**Category:** text
--	**Supports:** anchor, typography (fontSize, lineHeight)
+-	**Supports:** anchor, color (background, gradients, link, text), typography (fontSize, lineHeight)
 -	**Attributes:** align, citation, value
 
 ## Read More

diff --git a/packages/block-library/src/quote/block.json b/packages/block-library/src/quote/block.json
@@ -41,6 +41,14 @@
 				"fontSize": true,
 				"fontAppearance": true
 			}
+		},
+		"color": {
+			"gradients": true,
+			"link": true,
+			"__experimentalDefaultControls": {
+				"background": true,
+				"text": true
+			}
 		}
 	},
 	"styles": [

diff --git a/packages/block-library/src/quote/style.scss b/packages/block-library/src/quote/style.scss
@@ -1,4 +1,5 @@
 .wp-block-quote {
+	box-sizing: border-box;
 	overflow-wrap: break-word; // Break long strings of text without spaces so they don't overflow the block.
 	// .is-style-large and .is-large are kept for backwards compatibility. The :not pseudo-class is used to enable switching styles. See PR #37580.
 	&.is-style-large:not(.is-style-plain),