Product Button: Transition from using CSS margin to Global Styles (https://github.com/woocommerce/woocommerce-blocks/pull/8239)

This commit is contained in:
Daniel Dudzic 2023-01-20 16:23:00 +01:00 committed by GitHub
parent dc38c2a4a1
commit 48c4c71839
6 changed files with 17 additions and 6 deletions

View File

@ -1,7 +1,6 @@
.wp-block-button.wc-block-components-product-button {
word-break: break-word;
white-space: normal;
margin-bottom: $gap-small;
.wc-block-components-product-button__button {
border-style: none;
@ -20,6 +19,10 @@
min-width: 8em;
min-height: 3em;
}
.wc-block-all-products & {
margin-bottom: $gap-small;
}
}
.is-loading .wc-block-components-product-button > .wc-block-components-product-button__button {

View File

@ -103,7 +103,15 @@ export const INNER_BLOCKS_TEMPLATE: InnerBlockTemplate[] = [
],
[
'woocommerce/product-button',
{ textAlign: 'center', fontSize: 'small' },
{
textAlign: 'center',
fontSize: 'small',
style: {
spacing: {
margin: { bottom: '1rem' },
},
},
},
[],
],
],

View File

@ -14,7 +14,7 @@
<!-- wp:woocommerce/product-price {"isDescendentOfQueryLoop":true,"textAlign":"center","fontSize":"small","style":{"spacing":{"margin":{"bottom":"1rem"}}}} /-->
<!-- wp:woocommerce/product-button {"isDescendentOfQueryLoop":true,"textAlign":"center","fontSize":"small"} /-->
<!-- wp:woocommerce/product-button {"isDescendentOfQueryLoop":true,"textAlign":"center","fontSize":"small","style":{"spacing":{"margin":{"bottom":"1rem"}}}} /-->
<!-- /wp:post-template -->
<!-- wp:query-pagination {"layout":{"type":"flex","justifyContent":"center"}} -->

View File

@ -18,7 +18,7 @@
<!-- wp:woocommerce/product-rating {"isDescendentOfQueryLoop":true,"fontSize":"small","style":{"spacing":{"margin":{"bottom":"1rem"}}}} /--></div>
<!-- /wp:group -->
<!-- wp:woocommerce/product-button {"isDescendentOfQueryLoop":true,"fontSize":"small","style":{"spacing":{"margin":{"top":"1em"}}}} /-->
<!-- wp:woocommerce/product-button {"isDescendentOfQueryLoop":true,"fontSize":"small","style":{"spacing":{"margin":{"top":"1em","bottom":"1em"}}}} /-->
<!-- /wp:post-template -->
<!-- wp:query-pagination {"layout":{"type":"flex","justifyContent":"center"}} -->

View File

@ -22,7 +22,7 @@
<!-- wp:woocommerce/product-price {"isDescendentOfQueryLoop":true,"fontSize":"small","style":{"spacing":{"margin":{"bottom":"1rem"}}}} /-->
<!-- wp:woocommerce/product-button {"isDescendentOfQueryLoop":true,"fontSize":"small"} /--></div>
<!-- wp:woocommerce/product-button {"isDescendentOfQueryLoop":true,"fontSize":"small","style":{"spacing":{"margin":{"bottom":"1rem"}}}} /--></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->
<!-- /wp:post-template -->

View File

@ -30,7 +30,7 @@
<!-- /wp:column -->
<!-- wp:column {"width":"66.66%"} -->
<div class="wp-block-column" style="flex-basis:66.66%"><!-- wp:woocommerce/product-button {"isDescendentOfQueryLoop":true,"fontSize":"small"} /--></div>
<div class="wp-block-column" style="flex-basis:66.66%"><!-- wp:woocommerce/product-button {"isDescendentOfQueryLoop":true,"fontSize":"small","style":{"spacing":{"margin":{"bottom":"1rem"}}}} /--></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:column --></div>