From 5c505670c0e85089ed199a4da8a0731175b6147f Mon Sep 17 00:00:00 2001 From: mxkae Date: Tue, 3 Dec 2024 12:58:48 +0800 Subject: [PATCH 1/2] allow inherit theme link styles --- src/block/button/deprecated.js | 36 +++++++++++++++++++ src/block/button/edit.js | 1 + src/block/button/save.js | 44 ++++++++++++----------- src/block/icon-list-item/deprecated.js | 22 +++++++++++- src/block/icon-list-item/edit.js | 1 - src/block/icon-list-item/save.js | 6 ++-- src/block/icon-list-item/style.scss | 6 ++++ src/block/table-of-contents/deprecated.js | 9 +++++ src/block/table-of-contents/save.js | 1 + 9 files changed, 101 insertions(+), 25 deletions(-) diff --git a/src/block/button/deprecated.js b/src/block/button/deprecated.js index e7b1f9febc..d921ffded5 100644 --- a/src/block/button/deprecated.js +++ b/src/block/button/deprecated.js @@ -2,11 +2,47 @@ import { Save } from './save' import { attributes } from './schema' import { withVersion } from '~stackable/higher-order' +import { semverCompare } from '~stackable/util' import { + BlockDiv, CustomCSS, Button, Typography, deprecateBlockBackgroundColorOpacity, deprecateButtonGradientColor, deprecateContainerBackgroundColorOpacity, deprecateShadowColor, deprecateContainerShadowColor, deprecateBlockShadowColor, } from '~stackable/block-components' +import { addFilter } from '@wordpress/hooks' +import { useBlockProps } from '@wordpress/block-editor' + +// If button style is link, change BlockDiv tag from
to

to inherit theme link styles. +addFilter( 'stackable.button.save.blockDiv.content', 'stackable/inheritThemeLinkStyles', ( output, props, propsToPass, blockClassNames, customAttributes, typographyInnerClassNames ) => { + if ( semverCompare( props.version, '<', '3.13.11' ) ) { + return ( + + { props.attributes.generatedCss && } + + + + + + ) + } + return output +} ) const deprecated = [ { diff --git a/src/block/button/edit.js b/src/block/button/edit.js index 56127cdb54..1be3a4815c 100644 --- a/src/block/button/edit.js +++ b/src/block/button/edit.js @@ -98,6 +98,7 @@ const Edit = props => { attributes={ props.attributes } className={ blockClassNames } applyCustomAttributes={ false } + blockTag={ blockStyle === 'link' ? 'p' : null } >

) diff --git a/src/block/icon-list-item/style.scss b/src/block/icon-list-item/style.scss index 343681dbbd..99ee158a95 100644 --- a/src/block/icon-list-item/style.scss +++ b/src/block/icon-list-item/style.scss @@ -1,6 +1,12 @@ .stk-block-icon-list-item { list-style-type: none !important; + + .stk-block-icon-list-item__text { + margin-block: 0; + margin: 0; + } } + .stk-block-icon-list.stk-block { .wp-block-stackable-icon-list-item:not(:last-child)::after { content: "" !important; diff --git a/src/block/table-of-contents/deprecated.js b/src/block/table-of-contents/deprecated.js index 1aa3cccf62..4c7861a371 100644 --- a/src/block/table-of-contents/deprecated.js +++ b/src/block/table-of-contents/deprecated.js @@ -8,6 +8,7 @@ import { Save } from './save' * External dependencies */ import { withVersion } from '~stackable/higher-order' +import { semverCompare } from '~stackable/util' import compareVersions from 'compare-versions' import { deprecateBlockBackgroundColorOpacity, deprecateContainerBackgroundColorOpacity, deprecateTypographyGradientColor, @@ -19,6 +20,14 @@ import { */ import { addFilter } from '@wordpress/hooks' +addFilter( 'stackable.table-of-contents.save.blockClasses', 'stackable/inheritThemeLinkStyles', ( output, textClasses, props ) => { + if ( semverCompare( props.version, '<', '3.13.11' ) ) { + return output.filter( className => className !== 'entry-content' ) + } + + return output +} ) + addFilter( 'stackable.table-of-contents.save.blockClasses', 'stackable/classesNotRendered', ( output, textClasses, props ) => { if ( compareVersions( props.version, '3.6.2' ) === 0 ) { output.push( textClasses ) diff --git a/src/block/table-of-contents/save.js b/src/block/table-of-contents/save.js index 1fecb6c651..5967b33aa7 100644 --- a/src/block/table-of-contents/save.js +++ b/src/block/table-of-contents/save.js @@ -42,6 +42,7 @@ export const Save = props => { const blockClassNames = classnames( applyFilters( 'stackable.table-of-contents.save.blockClasses', [ className, 'stk-block-table-of-contents', + 'entry-content', // add this class to inherit theme link styles blockAlignmentClass, responsiveClass, ], textClasses, props ) ) From 22077ee728c5fc3988bdc76fcf6fe1b3fa1917ea Mon Sep 17 00:00:00 2001 From: Mikhaela Tapia Date: Thu, 24 Apr 2025 12:42:54 +0800 Subject: [PATCH 2/2] update version --- src/block/button/deprecated.js | 2 +- src/block/icon-list-item/deprecated.js | 2 +- src/block/table-of-contents/deprecated.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/block/button/deprecated.js b/src/block/button/deprecated.js index d921ffded5..c2229d57a3 100644 --- a/src/block/button/deprecated.js +++ b/src/block/button/deprecated.js @@ -14,7 +14,7 @@ import { useBlockProps } from '@wordpress/block-editor' // If button style is link, change BlockDiv tag from
to

to inherit theme link styles. addFilter( 'stackable.button.save.blockDiv.content', 'stackable/inheritThemeLinkStyles', ( output, props, propsToPass, blockClassNames, customAttributes, typographyInnerClassNames ) => { - if ( semverCompare( props.version, '<', '3.13.11' ) ) { + if ( semverCompare( props.version, '<=', '3.15.3' ) ) { return ( to

to inherit theme link styles. addFilter( 'stackable.icon-list-item.save.typography.content', 'stackable/inheritThemeLinkStyles', ( output, props, attrs, textClassNames ) => { - if ( semverCompare( props.version, '<', '3.13.11' ) ) { + if ( semverCompare( props.version, '<=', '3.15.3' ) ) { return ( { - if ( semverCompare( props.version, '<', '3.13.11' ) ) { + if ( semverCompare( props.version, '<=', '3.15.3' ) ) { return output.filter( className => className !== 'entry-content' ) }