From 22cb97618f1aa019a0b2b566a93dc532826f08d7 Mon Sep 17 00:00:00 2001 From: Alquen Sarmiento Date: Mon, 13 Jan 2025 11:08:47 +0800 Subject: [PATCH] fix(icon-list): apply gradient directly to text, fix specificity issue --- src/block/icon-list-item/style.scss | 11 +++++++++++ src/block/icon-list/style.js | 3 +++ 2 files changed, 14 insertions(+) diff --git a/src/block/icon-list-item/style.scss b/src/block/icon-list-item/style.scss index 343681dbb..f5b4b21af 100644 --- a/src/block/icon-list-item/style.scss +++ b/src/block/icon-list-item/style.scss @@ -96,3 +96,14 @@ li.wp-block-stackable-icon-list-item.stk-block-icon-list-item { margin-bottom: 0; } + +// If single text color is added (not gradient), reset text-fill-color. +// Icon list marker is only limited to single text color. +// These ensure that having gradient in parent icon list still allows +// modification in icon list items. +.stk-block-icon-list-item__text:is(.has-text-color):not(.stk--is-gradient), +.stk-block-icon-list-item__marker { + -webkit-text-fill-color: initial !important; + -moz-text-fill-color: initial !important; + -o-text-fill-color: initial !important; +} diff --git a/src/block/icon-list/style.js b/src/block/icon-list/style.js index 5777f93b3..68c60aa0a 100644 --- a/src/block/icon-list/style.js +++ b/src/block/icon-list/style.js @@ -212,6 +212,9 @@ Typography.addStyles( blockStyles, { selector: [ 'ul li', 'ol li', + // Apply directly to span for gradient text color + 'ul li span', + 'ol li span', ], hoverSelector: [ '.%s:hover ul li',