RSS: Added Colour support

docs/reference-guides/core-blocks.md

@@ -801,7 +801,7 @@ Display entries from any RSS or Atom feed. ([Source](https://github.com/WordPres
 
 -	**Name:** core/rss
 -	**Category:** widgets
--	**Supports:** align, interactivity (clientNavigation), ~~html~~
+-	**Supports:** align, color (background, gradients, link, text), interactivity (clientNavigation), typography (fontFamily, fontSize, fontStyle, fontWeight, letterSpacing, lineHeight, textDecoration, textTransform), ~~html~~
 -	**Attributes:** blockLayout, columns, displayAuthor, displayDate, displayExcerpt, excerptLength, feedURL, itemsToShow
 
 ## Search

packages/block-library/src/rss/block.json

@@ -46,6 +46,27 @@
 		"html": false,
 		"interactivity": {
 			"clientNavigation": true
+		},
+		"color": {
+			"background": true,
+			"text": true,
+			"gradients": true,
+			"link": true
+		},
+		"typography": {
+			"fontSize": true,
+			"lineHeight": true,
+			"fontFamily": true,
+			"fontWeight": true,
+			"fontStyle": true,
+			"textTransform": true,
+			"letterSpacing": true,
+			"textDecoration": true,
+			"__experimentalSkipSerialization": [ "textDecoration" ],
+			"__experimentalDefaultControls": {
+				"fontSize": true,
+				"textDecoration": true
+			}
 		}
 	},
 	"editorStyle": "wp-block-rss-editor",

packages/block-library/src/rss/edit.js

@@ -58,6 +58,7 @@ export default function RSSEdit( { attributes, setAttributes } ) {
 
 	const blockProps = useBlockProps();
 
+	const textDecoration = attributes.style?.typography?.textDecoration;
 	const label = __( 'RSS URL' );
 
 	if ( isEditing ) {
@@ -190,6 +191,11 @@ export default function RSSEdit( { attributes, setAttributes } ) {
 					<ServerSideRender
 						block="core/rss"
 						attributes={ attributes }
+						className={
+							textDecoration
+								? 'has-text-decoration-' + textDecoration
+								: textDecoration
+						}
 					/>
 				</Disabled>
 			</div>

packages/block-library/src/rss/index.php

@@ -101,6 +101,10 @@
 	if ( $attributes['displayExcerpt'] ) {
 		$classnames[] = 'has-excerpts';
 	}
+	// Manually add block support text decoration as CSS class.
+	$text_decoration       = $attributes['style']['typography']['textDecoration'] ?? null;
+	$text_decoration_class = sprintf( 'has-text-decoration-%s', $text_decoration );
+	$classnames[] = $text_decoration ? $text_decoration_class : '';
 
 	$wrapper_attributes = get_block_wrapper_attributes( array( 'class' => implode( ' ', $classnames ) ) );
 

packages/block-library/src/rss/style.scss

@@ -27,6 +27,41 @@ ul.wp-block-rss { // The ul is needed for specificity to override the reset styl
 		}
 	}
 
+	// The following rules provide class based application of user selected text
+	// decoration via block supports.
+	&.has-text-decoration-underline li.wp-block-rss__item a {
+		text-decoration: underline;
+
+		&:focus,
+		&:active {
+			text-decoration: underline;
+		}
+	}
+
+	&.has-text-decoration-line-through li.wp-block-rss__item a {
+		text-decoration: line-through;
+
+		&:focus,
+		&:active {
+			text-decoration: line-through;
+		}
+	}
+
+	&.has-text-decoration-none li.wp-block-rss__item a {
+		text-decoration: none;
+
+		&:focus,
+		&:active {
+			text-decoration: none;
+		}
+	}
+
+	& :where(a),
+	& :where(a:focus),
+	& :where(a:active) {
+		text-decoration: none;
+	}
+
 	@include break-small {
 		@for $i from 2 through 6 {
 			&.columns-#{ $i } li {