Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Add `Customer account` to patterns (https://github.com/woocommerce/woocommerce-blocks/pull/7944) 

* Render the block in the frontend

* Add icon style selector to Display settings

This adds an icon style selector in which users can choose the customer account link icon.

* Display on the frontend depending on the icon style

* Rename attributes

* Refactor block rendering

* Improve styling

* Add link to account settings

* Split css file

* Switch to SSR

* Add customer account block to header patterns

* Add customer account block to footer patterns

* Adapt minimal header to designs

* Adapt large header to designs

* Adapt header patterns to new designs and format code

* Adapt footer patterns to the designs

* Change display style for the essential header

* Increase alt icon size

* Make the icon resize with the label

* Adjust icon size on headers

* Add padding and move second row to the right

* Remove unused enum

Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
This commit is contained in:
Alba Rincón 2022-12-23 10:08:44 +01:00 committed by GitHub
parent fdbe4e7c54
commit f9dd42a36a
16 changed files with 473 additions and 286 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
plugins/woocommerce-blocks/assets/js/blocks/customer-account/block.tsx
View File

@ -27,7 +27,7 @@ const AccountIcon = ( {
: customerAccountStyle;
return displayStyle === DisplayStyle.TEXT_ONLY ? null : (
<Icon className="icon" icon={ icon } size={ 16 } />
<Icon className="icon" icon={ icon } size={ 18 } />
);
};

2
plugins/woocommerce-blocks/assets/js/blocks/customer-account/sidebar-settings.tsx
View File

@ -142,7 +142,7 @@ export const BlockSettings = ( {
label={
<Icon
icon={ customerAccountStyleAlt }
size={ 18 }
size={ 20 }
className={ classNames(
'wc-block-customer-account__icon-option',
{

5
plugins/woocommerce-blocks/assets/js/blocks/customer-account/style.scss
View File

@ -12,5 +12,10 @@
.icon + .label {
margin-left: $gap-smaller;
}
.icon {
height: em(16px);
width: em(16px);
}
}
}

116
plugins/woocommerce-blocks/patterns/footer-large-dark.php
View File

@ -8,47 +8,79 @@
?>
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"32px","right":"4%","bottom":"32px","left":"4%"},"blockGap":"40px"},"elements":{"link":{"color":{"text":"var:preset|color|background"}}}},"backgroundColor":"black","textColor":"white"} -->
<div class="wp-block-group alignfull has-background-color has-white-color has-black-background-color has-text-color has-background has-link-color" style="padding-top:32px;padding-right:4%;padding-bottom:32px;padding-left:4%"><!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":"16px"}}} -->
<div class="wp-block-columns alignwide"><!-- wp:column {"width":"45%","style":{"spacing":{"padding":{"right":"50px"}}}} -->
<div class="wp-block-column" style="padding-right:50px;flex-basis:45%"><!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"textColor":"background","layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group has-background-color has-text-color"><!-- wp:heading {"level":5} -->
<h5>Join the community</h5>
<!-- /wp:heading -->
<div
class="wp-block-group alignfull has-background-color has-white-color has-black-background-color has-text-color has-background has-link-color"
style="padding-top:32px;padding-right:4%;padding-bottom:32px;padding-left:4%">
<!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":"16px"}}} -->
<div class="wp-block-columns alignwide">
<!-- wp:column {"width":"45%","style":{"spacing":{"padding":{"right":"50px"}}}} -->
<div class="wp-block-column" style="padding-right:50px;flex-basis:45%">
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"textColor":"background","layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group has-background-color has-text-color">
<!-- wp:site-logo /-->
<!-- wp:paragraph -->
<p>Learn about new products and discounts!</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->
<!-- wp:social-links {"iconColor":"background","iconColorValue":"#ffffff","size":"has-small-icon-size","className":"is-style-logos-only"} -->
<ul class="wp-block-social-links has-small-icon-size has-icon-color is-style-logos-only"><!-- wp:social-link {"service":"facebook"} /-->
<!-- wp:social-link {"service":"twitter"} /-->
<!-- wp:social-link {"service":"instagram"} /--></ul>
<!-- /wp:social-links --></div>
<!-- /wp:column -->
<!-- wp:column {"width":"20%","style":{"spacing":{"padding":{"top":"0px"}}}} -->
<div class="wp-block-column" style="padding-top:0px;flex-basis:20%"><!-- wp:navigation {"layout":{"type":"flex","orientation":"vertical"}} /--></div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"top","width":"20%","style":{"spacing":{"blockGap":"16px"}}} -->
<div class="wp-block-column is-vertically-aligned-top" style="flex-basis:20%"><!-- wp:navigation {"layout":{"type":"flex","orientation":"vertical"}} /--></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"0px","right":"0px","bottom":"0px","left":"0px"},"blockGap":"10px"}},"textColor":"background","layout":{"type":"flex","flexWrap":"wrap","justifyContent":"center"}} -->
<div class="wp-block-group alignfull has-background-color has-text-color" style="padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px"><!-- wp:group {"style":{"spacing":{"blockGap":"8px"},"elements":{"link":{"color":{"text":"var:preset|color|background"}}}},"textColor":"background","layout":{"type":"flex","flexWrap":"nowrap"}} -->
<div class="wp-block-group has-background-color has-text-color has-link-color"><!-- wp:paragraph {"style":{"typography":{"fontSize":"12px"}}} -->
<p style="font-size:12px">@ 2022</p>
<!-- /wp:paragraph -->
<!-- wp:site-title {"style":{"typography":{"fontStyle":"normal","fontWeight":"400","fontSize":"12px"}}} /--></div>
<!-- /wp:group -->
<!-- wp:paragraph {"style":{"typography":{"fontSize":"14px"}}} -->
<p style="font-size:14px"><em>Built with <a href="https://woocommerce.com/">WooCommerce</a> </em></p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- wp:spacer {"height":"30px"} -->
<div style="height:30px" aria-hidden="true" class="wp-block-spacer"></div>
<!-- /wp:spacer -->
<!-- wp:heading {"level":5} -->
<h5>Join the community</h5>
<!-- /wp:heading -->
<!-- wp:paragraph -->
<p>Learn about new products and discounts!</p>
<!-- /wp:paragraph -->
<!-- wp:spacer {"height":"20px"} -->
<div style="height:20px" aria-hidden="true" class="wp-block-spacer"></div>
<!-- /wp:spacer -->
</div>
<!-- /wp:group -->
<!-- wp:social-links {"iconColor":"background","iconColorValue":"#ffffff","size":"has-small-icon-size","className":"is-style-logos-only"} -->
<ul class="wp-block-social-links has-small-icon-size has-icon-color is-style-logos-only">
<!-- wp:social-link {"url":"d","service":"facebook"} /-->
<!-- wp:social-link {"url":"d","service":"twitter"} /-->
<!-- wp:social-link {"url":"d","service":"instagram"} /-->
</ul>
<!-- /wp:social-links -->
</div>
<!-- /wp:column -->
<!-- wp:column {"width":"20%","style":{"spacing":{"padding":{"top":"0px"}}}} -->
<div class="wp-block-column" style="padding-top:0px;flex-basis:20%">
<!-- wp:navigation {"layout":{"type":"flex","orientation":"vertical"}} /--></div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"top","width":"20%","style":{"spacing":{"blockGap":"16px"}}} -->
<div class="wp-block-column is-vertically-aligned-top" style="flex-basis:20%">
<!-- wp:navigation {"layout":{"type":"flex","orientation":"vertical"}} /-->
</div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"top","width":"20%","style":{"spacing":{"blockGap":"16px"}}} -->
<div class="wp-block-column is-vertically-aligned-top" style="flex-basis:20%">
<!-- wp:woocommerce/customer-account {"displayStyle":"text_only"} /-->
</div>
<!-- /wp:column -->
</div>
<!-- /wp:columns -->
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"0px","right":"0px","bottom":"0px","left":"0px"},"blockGap":"10px"}},"textColor":"background","layout":{"type":"flex","flexWrap":"wrap","justifyContent":"center"}} -->
<div class="wp-block-group alignfull has-background-color has-text-color" style="padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px">
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"},"elements":{"link":{"color":{"text":"var:preset|color|background"}}}},"textColor":"background","layout":{"type":"flex","flexWrap":"nowrap"}} -->
<div class="wp-block-group has-background-color has-text-color has-link-color">
<!-- wp:paragraph {"style":{"typography":{"fontSize":"12px"}}} -->
<p style="font-size:12px">@ 2022</p>
<!-- /wp:paragraph -->
<!-- wp:site-title {"style":{"typography":{"fontStyle":"normal","fontWeight":"400","fontSize":"12px"}}} /-->
</div>
<!-- /wp:group -->
<!-- wp:paragraph {"style":{"typography":{"fontSize":"14px"}}} -->
<p style="font-size:14px"><em>Built with <a href="https://woocommerce.com/">WooCommerce</a> </em></p>
<!-- /wp:paragraph -->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:group -->

116
plugins/woocommerce-blocks/patterns/footer-large.php
View File

@ -8,48 +8,78 @@
?>
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"32px","right":"4%","bottom":"32px","left":"4%"},"blockGap":"40px"}}} -->
<div class="wp-block-group alignfull" style="padding-top:32px;padding-right:4%;padding-bottom:32px;padding-left:4%"><!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":"16px"}}} -->
<div class="wp-block-columns alignwide"><!-- wp:column {"width":"45%","style":{"spacing":{"padding":{"right":"50px"}}}} -->
<div class="wp-block-column" style="padding-right:50px;flex-basis:45%"><!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group"><!-- wp:heading {"level":5} -->
<h5>Join the community</h5>
<!-- /wp:heading -->
<div class="wp-block-group alignfull" style="padding-top:32px;padding-right:4%;padding-bottom:32px;padding-left:4%">
<!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":"16px"}}} -->
<div class="wp-block-columns alignwide">
<!-- wp:column {"width":"45%","style":{"spacing":{"padding":{"right":"50px"}}}} -->
<div class="wp-block-column" style="padding-right:50px;flex-basis:45%">
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group">
<!-- wp:site-logo /-->
<!-- wp:paragraph -->
<p>Learn about new products and discounts!</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->
<!-- wp:social-links {"size":"has-small-icon-size","className":"is-style-logos-only"} -->
<ul class="wp-block-social-links has-small-icon-size is-style-logos-only"><!-- wp:social-link {"service":"facebook"} /-->
<!-- wp:social-link {"service":"twitter"} /-->
<!-- wp:social-link {"service":"instagram"} /--></ul>
<!-- /wp:social-links --></div>
<!-- /wp:column -->
<!-- wp:column {"width":"20%","style":{"spacing":{"padding":{"top":"0px"}}}} -->
<div class="wp-block-column" style="padding-top:0px;flex-basis:20%"><!-- wp:navigation {"layout":{"type":"flex","orientation":"vertical"}} /--></div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"top","width":"20%","style":{"spacing":{"blockGap":"16px"}}} -->
<div class="wp-block-column is-vertically-aligned-top" style="flex-basis:20%"><!-- wp:navigation {"layout":{"type":"flex","orientation":"vertical"}} -->
<!-- /wp:navigation --></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"0px","right":"0px","bottom":"0px","left":"0px"},"blockGap":"10px"}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"center"}} -->
<div class="wp-block-group alignfull" style="padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px"><!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","flexWrap":"nowrap"}} -->
<div class="wp-block-group"><!-- wp:paragraph {"style":{"typography":{"fontSize":"12px"}}} -->
<p style="font-size:12px">@ 2022</p>
<!-- /wp:paragraph -->
<!-- wp:site-title {"style":{"typography":{"fontStyle":"normal","fontWeight":"400","fontSize":"12px"}}} /--></div>
<!-- /wp:group -->
<!-- wp:paragraph {"style":{"typography":{"fontSize":"14px"}}} -->
<p style="font-size:14px"><em>Built with <a href="https://woocommerce.com/">WooCommerce</a> </em></p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- wp:spacer {"height":"30px"} -->
<div style="height:30px" aria-hidden="true" class="wp-block-spacer"></div>
<!-- /wp:spacer -->
<!-- wp:heading {"level":5} -->
<h5>Join the community</h5>
<!-- /wp:heading -->
<!-- wp:paragraph -->
<p>Learn about new products and discounts!</p>
<!-- /wp:paragraph -->
<!-- wp:spacer {"height":"20px"} -->
<div style="height:20px" aria-hidden="true" class="wp-block-spacer"></div>
<!-- /wp:spacer -->
</div>
<!-- /wp:group -->
<!-- wp:social-links {"size":"has-small-icon-size","className":"is-style-logos-only"} -->
<ul class="wp-block-social-links has-small-icon-size is-style-logos-only">
<!-- wp:social-link {"url":"d","service":"facebook"} /-->
<!-- wp:social-link {"url":"d","service":"twitter"} /-->
<!-- wp:social-link {"url":"d","service":"instagram"} /-->
</ul>
<!-- /wp:social-links -->
</div>
<!-- /wp:column -->
<!-- wp:column {"width":"20%","style":{"spacing":{"padding":{"top":"0px"}}}} -->
<div class="wp-block-column" style="padding-top:0px;flex-basis:20%">
<!-- wp:navigation {"layout":{"type":"flex","orientation":"vertical"}} /--></div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"top","width":"20%","style":{"spacing":{"blockGap":"16px"}}} -->
<div class="wp-block-column is-vertically-aligned-top" style="flex-basis:20%">
<!-- wp:navigation {"layout":{"type":"flex","orientation":"vertical"}} -->
<!-- /wp:navigation -->
</div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"top","width":"20%","style":{"spacing":{"blockGap":"16px"}}} -->
<div class="wp-block-column is-vertically-aligned-top" style="flex-basis:20%">
<!-- wp:woocommerce/customer-account {"displayStyle":"text_only"} /-->
</div>
<!-- /wp:column -->
</div>
<!-- /wp:columns -->
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"0px","right":"0px","bottom":"0px","left":"0px"},"blockGap":"10px"}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"center"}} -->
<div class="wp-block-group alignfull" style="padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px">
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","flexWrap":"nowrap"}} -->
<div class="wp-block-group">
<!-- wp:paragraph {"style":{"typography":{"fontSize":"12px"}}} -->
<p style="font-size:12px">@ 2022</p>
<!-- /wp:paragraph -->
<!-- wp:site-title {"style":{"typography":{"fontStyle":"normal","fontWeight":"400","fontSize":"12px"}}} /-->
</div>
<!-- /wp:group -->
<!-- wp:paragraph {"style":{"typography":{"fontSize":"14px"}}} -->
<p style="font-size:14px"><em>Built with <a href="https://woocommerce.com/">WooCommerce</a> </em></p>
<!-- /wp:paragraph -->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:group -->

72
plugins/woocommerce-blocks/patterns/footer-simple-dark.php
View File

@ -8,35 +8,51 @@
?>
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"32px","right":"48px","bottom":"32px","left":"48px"},"blockGap":"40px"},"elements":{"link":{"color":{"text":"var:preset|color|background"}}}},"backgroundColor":"black","textColor":"white"} -->
<div class="wp-block-group alignfull has-background-color has-white-color has-black-background-color has-text-color has-background has-link-color" style="padding-top:32px;padding-right:48px;padding-bottom:32px;padding-left:48px"><!-- wp:columns -->
<div class="wp-block-columns"><!-- wp:column {"width":"50%"} -->
<div class="wp-block-column" style="flex-basis:50%"><!-- wp:group {"style":{"spacing":{"blockGap":"32px"}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"center"}} -->
<div class="wp-block-group"><!-- wp:navigation /--></div>
<!-- /wp:group --></div>
<!-- /wp:column -->
<div class="wp-block-group alignfull has-background-color has-white-color has-black-background-color has-text-color has-background has-link-color" style="padding-top:32px;padding-right:48px;padding-bottom:32px;padding-left:48px">
<!-- wp:columns -->
<div class="wp-block-columns">
<!-- wp:column {"width":"50%"} -->
<div class="wp-block-column" style="flex-basis:50%">
<!-- wp:group {"style":{"spacing":{"blockGap":"32px"}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"center"}} -->
<div class="wp-block-group">
<!-- wp:site-logo /-->
<!-- wp:woocommerce/customer-account /-->
<!-- wp:navigation -->
<!-- /wp:navigation -->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"center","width":"50%"} -->
<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:50%"><!-- wp:social-links {"iconColor":"background","iconColorValue":"#ffffff","className":"is-style-logos-only","layout":{"type":"flex","justifyContent":"center"}} -->
<ul class="wp-block-social-links has-icon-color is-style-logos-only"><!-- wp:social-link {"service":"facebook"} /-->
<!-- wp:column {"verticalAlignment":"center","width":"50%"} -->
<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:50%">
<!-- wp:social-links {"iconColor":"background","iconColorValue":"#ffffff","className":"is-style-logos-only","layout":{"type":"flex","justifyContent":"center"}} -->
<ul class="wp-block-social-links has-icon-color is-style-logos-only">
<!-- wp:social-link {"service":"facebook"} /-->
<!-- wp:social-link {"service":"instagram"} /-->
<!-- wp:social-link {"service":"twitter"} /-->
</ul>
<!-- /wp:social-links -->
</div>
<!-- /wp:column -->
</div>
<!-- /wp:columns -->
<!-- wp:social-link {"service":"instagram"} /-->
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"0px","right":"0px","bottom":"0px","left":"0px"},"blockGap":"12px"}},"textColor":"background","layout":{"type":"flex","flexWrap":"wrap","justifyContent":"center"}} -->
<div class="wp-block-group alignfull has-background-color has-text-color" style="padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px">
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"center"}} -->
<div class="wp-block-group">
<!-- wp:paragraph {"style":{"typography":{"fontSize":"12px"}}} -->
<p style="font-size:12px">@ 2022</p>
<!-- /wp:paragraph -->
<!-- wp:site-title {"style":{"typography":{"fontStyle":"normal","fontWeight":"400","fontSize":"12px"},"elements":{"link":{"color":{"text":"var:preset|color|background"}}}}} /-->
</div>
<!-- /wp:group -->
<!-- wp:social-link {"service":"twitter"} /--></ul>
<!-- /wp:social-links --></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"0px","right":"0px","bottom":"0px","left":"0px"},"blockGap":"12px"}},"textColor":"background","layout":{"type":"flex","flexWrap":"wrap","justifyContent":"center"}} -->
<div class="wp-block-group alignfull has-background-color has-text-color" style="padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px"><!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"center"}} -->
<div class="wp-block-group"><!-- wp:paragraph {"style":{"typography":{"fontSize":"12px"}}} -->
<p style="font-size:12px">@ 2022</p>
<!-- /wp:paragraph -->
<!-- wp:site-title {"style":{"typography":{"fontStyle":"normal","fontWeight":"400","fontSize":"12px"},"elements":{"link":{"color":{"text":"var:preset|color|background"}}}}} /--></div>
<!-- /wp:group -->
<!-- wp:paragraph {"style":{"typography":{"fontSize":"14px"}}} -->
<p style="font-size:14px"><em>Built with <a href="https://woocommerce.com/">WooCommerce</a> </em></p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- wp:paragraph {"style":{"typography":{"fontSize":"14px"}}} -->
<p style="font-size:14px"><em>Built with <a href="https://woocommerce.com/">WooCommerce</a> </em></p>
<!-- /wp:paragraph -->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:group -->

73
plugins/woocommerce-blocks/patterns/footer-simple.php
View File

@ -8,36 +8,51 @@
?>
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"32px","right":"48px","bottom":"32px","left":"48px"},"blockGap":"40px"}}} -->
<div class="wp-block-group alignfull" style="padding-top:32px;padding-right:48px;padding-bottom:32px;padding-left:48px"><!-- wp:columns -->
<div class="wp-block-columns"><!-- wp:column {"width":"50%"} -->
<div class="wp-block-column" style="flex-basis:50%"><!-- wp:group {"style":{"spacing":{"blockGap":"32px"}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"center"}} -->
<div class="wp-block-group"><!-- wp:navigation -->
<!-- /wp:navigation --></div>
<!-- /wp:group --></div>
<!-- /wp:column -->
<div class="wp-block-group alignfull" style="padding-top:32px;padding-right:48px;padding-bottom:32px;padding-left:48px">
<!-- wp:columns -->
<div class="wp-block-columns">
<!-- wp:column {"width":"50%"} -->
<div class="wp-block-column" style="flex-basis:50%">
<!-- wp:group {"style":{"spacing":{"blockGap":"32px"}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"center"}} -->
<div class="wp-block-group">
<!-- wp:site-logo /-->
<!-- wp:woocommerce/customer-account /-->
<!-- wp:navigation -->
<!-- /wp:navigation -->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"center","width":"50%"} -->
<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:50%"><!-- wp:social-links {"className":"is-style-logos-only","layout":{"type":"flex","justifyContent":"center"}} -->
<ul class="wp-block-social-links is-style-logos-only"><!-- wp:social-link {"service":"facebook"} /-->
<!-- wp:column {"verticalAlignment":"center","width":"50%"} -->
<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:50%">
<!-- wp:social-links {"className":"is-style-logos-only","layout":{"type":"flex","justifyContent":"center"}} -->
<ul class="wp-block-social-links is-style-logos-only">
<!-- wp:social-link {"service":"facebook"} /-->
<!-- wp:social-link {"service":"instagram"} /-->
<!-- wp:social-link {"service":"twitter"} /-->
</ul>
<!-- /wp:social-links -->
</div>
<!-- /wp:column -->
</div>
<!-- /wp:columns -->
<!-- wp:social-link {"service":"instagram"} /-->
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"0px","right":"0px","bottom":"0px","left":"0px"},"blockGap":"12px"}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"center"}} -->
<div class="wp-block-group alignfull" style="padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px">
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"center"}} -->
<div class="wp-block-group">
<!-- wp:paragraph {"style":{"typography":{"fontSize":"12px"}}} -->
<p style="font-size:12px">@ 2022</p>
<!-- /wp:paragraph -->
<!-- wp:site-title {"style":{"typography":{"fontStyle":"normal","fontWeight":"400","fontSize":"12px"}}} /-->
</div>
<!-- /wp:group -->
<!-- wp:social-link {"service":"twitter"} /--></ul>
<!-- /wp:social-links --></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"0px","right":"0px","bottom":"0px","left":"0px"},"blockGap":"12px"}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"center"}} -->
<div class="wp-block-group alignfull" style="padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px"><!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"center"}} -->
<div class="wp-block-group"><!-- wp:paragraph {"style":{"typography":{"fontSize":"12px"}}} -->
<p style="font-size:12px">@ 2022</p>
<!-- /wp:paragraph -->
<!-- wp:site-title {"style":{"typography":{"fontStyle":"normal","fontWeight":"400","fontSize":"12px"}}} /--></div>
<!-- /wp:group -->
<!-- wp:paragraph {"style":{"typography":{"fontSize":"14px"}}} -->
<p style="font-size:14px"><em>Built with <a href="https://woocommerce.com/">WooCommerce</a> </em></p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- wp:paragraph {"style":{"typography":{"fontSize":"14px"}}} -->
<p style="font-size:14px"><em>Built with <a href="https://woocommerce.com/">WooCommerce</a> </em></p>
<!-- /wp:paragraph -->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:group -->

103
plugins/woocommerce-blocks/patterns/footer-with-2-menus-dark.php
View File

@ -8,51 +8,68 @@
?>
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"32px","right":"4%","bottom":"32px","left":"4%"},"blockGap":"40px"},"elements":{"link":{"color":{"text":"var:preset|color|background"}}}},"backgroundColor":"black","textColor":"white"} -->
<div class="wp-block-group alignfull has-background-color has-black-background-color has-white-color has-text-color has-background has-link-color" style="padding-top:32px;padding-right:4%;padding-bottom:32px;padding-left:4%"><!-- wp:columns -->
<div class="wp-block-columns"><!-- wp:column {"width":"70%"} -->
<div class="wp-block-column" style="flex-basis:70%"><!-- wp:group {"style":{"spacing":{"blockGap":"32px"}},"layout":{"type":"flex","flexWrap":"wrap"}} -->
<div class="wp-block-group"><!-- wp:site-logo {"shouldSyncIcon":false} /-->
<div class="wp-block-group alignfull has-background-color has-black-background-color has-white-color has-text-color has-background has-link-color" style="padding-top:32px;padding-right:4%;padding-bottom:32px;padding-left:4%">
<!-- wp:columns -->
<div class="wp-block-columns">
<!-- wp:column {"width":"70%"} -->
<div class="wp-block-column" style="flex-basis:70%">
<!-- wp:group {"style":{"spacing":{"blockGap":"32px"}},"layout":{"type":"flex","flexWrap":"wrap"}} -->
<div class="wp-block-group">
<!-- wp:site-logo {"shouldSyncIcon":false} /-->
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","orientation":"vertical","flexWrap":"nowrap"}} -->
<div class="wp-block-group"><!-- wp:navigation /-->
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","orientation":"vertical","flexWrap":"nowrap"}} -->
<div class="wp-block-group">
<!-- wp:navigation /-->
<!-- wp:navigation /-->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:column -->
<!-- wp:navigation /--></div>
<!-- /wp:group --></div>
<!-- /wp:group --></div>
<!-- /wp:column -->
<!-- wp:column {"style":{"spacing":{"blockGap":"16px"}}} -->
<div class="wp-block-column">
<!-- wp:group {"style":{"spacing":{"blockGap":"4px"}},"textColor":"background","layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group has-background-color has-text-color">
<!-- wp:paragraph {"textColor":"background","fontSize":"medium"} -->
<p class="has-background-color has-text-color has-medium-font-size"><strong>Join our community</strong>
</p>
<!-- /wp:paragraph -->
<!-- wp:column {"style":{"spacing":{"blockGap":"16px"}}} -->
<div class="wp-block-column"><!-- wp:group {"style":{"spacing":{"blockGap":"4px"}},"textColor":"background","layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group has-background-color has-text-color"><!-- wp:paragraph {"textColor":"background","fontSize":"medium"} -->
<p class="has-background-color has-text-color has-medium-font-size"><strong>Join our community</strong></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph {"style":{"typography":{"fontSize":"14px"}}} -->
<p style="font-size:14px">Learn about new products and discounts!</p>
<!-- /wp:paragraph -->
</div>
<!-- /wp:group -->
<!-- wp:paragraph {"style":{"typography":{"fontSize":"14px"}}} -->
<p style="font-size:14px">Learn about new products and discounts!</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->
<!-- wp:social-links {"iconColor":"background","iconColorValue":"#ffffff","className":"is-style-logos-only"} -->
<ul class="wp-block-social-links has-icon-color is-style-logos-only"><!-- wp:social-link {"service":"facebook"} /-->
<!-- wp:social-link {"service":"instagram"} /-->
<!-- wp:social-link {"service":"twitter"} /--></ul>
<!-- /wp:social-links --></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"0px","right":"0px","bottom":"0px","left":"0px"},"blockGap":"16px"},"elements":{"link":{"color":{"text":"var:preset|color|background"}}}},"textColor":"background","layout":{"type":"flex","flexWrap":"wrap","justifyContent":"center"}} -->
<div class="wp-block-group alignfull has-background-color has-text-color has-link-color" style="padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px"><!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"center"}} -->
<div class="wp-block-group"><!-- wp:paragraph {"style":{"typography":{"fontSize":"12px"}}} -->
<p style="font-size:12px">@ 2022</p>
<!-- /wp:paragraph -->
<!-- wp:site-title {"style":{"typography":{"fontStyle":"normal","fontWeight":"400","fontSize":"12px"}}} /--></div>
<!-- /wp:group -->
<!-- wp:paragraph {"style":{"typography":{"fontSize":"14px"}}} -->
<p style="font-size:14px"><em>Built with <a href="https://woocommerce.com/">WooCommerce</a> </em></p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- wp:social-links {"iconColor":"background","iconColorValue":"#ffffff","className":"is-style-logos-only"} -->
<ul class="wp-block-social-links has-icon-color is-style-logos-only">
<!-- wp:social-link {"service":"facebook"} /-->
<!-- wp:social-link {"service":"instagram"} /-->
<!-- wp:social-link {"service":"twitter"} /-->
</ul>
<!-- /wp:social-links -->
</div>
<!-- /wp:column -->
</div>
<!-- /wp:columns -->
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"0px","right":"0px","bottom":"0px","left":"0px"},"blockGap":"16px"},"elements":{"link":{"color":{"text":"var:preset|color|background"}}}},"textColor":"background","layout":{"type":"flex","flexWrap":"wrap","justifyContent":"center"}} -->
<div class="wp-block-group alignfull has-background-color has-text-color has-link-color" style="padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px">
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"center"}} -->
<div class="wp-block-group">
<!-- wp:paragraph {"style":{"typography":{"fontSize":"12px"}}} -->
<p style="font-size:12px">@ 2022</p>
<!-- /wp:paragraph -->
<!-- wp:site-title {"style":{"typography":{"fontStyle":"normal","fontWeight":"400","fontSize":"12px"}}} /-->
</div>
<!-- /wp:group -->
<!-- wp:paragraph {"style":{"typography":{"fontSize":"14px"}}} -->
<p style="font-size:14px"><em>Built with <a href="https://woocommerce.com/">WooCommerce</a> </em></p>
<!-- /wp:paragraph -->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:group -->

104
plugins/woocommerce-blocks/patterns/footer-with-2-menus.php
View File

@ -8,53 +8,67 @@
?>
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"32px","right":"4%","bottom":"32px","left":"4%"},"blockGap":"40px"}}} -->
<div class="wp-block-group alignfull" style="padding-top:32px;padding-right:4%;padding-bottom:32px;padding-left:4%"><!-- wp:columns -->
<div class="wp-block-columns"><!-- wp:column {"width":"70%"} -->
<div class="wp-block-column" style="flex-basis:70%"><!-- wp:group {"style":{"spacing":{"blockGap":"32px"}},"layout":{"type":"flex","flexWrap":"wrap"}} -->
<div class="wp-block-group"><!-- wp:site-logo {"shouldSyncIcon":false} /-->
<div class="wp-block-group alignfull" style="padding-top:32px;padding-right:4%;padding-bottom:32px;padding-left:4%">
<!-- wp:columns -->
<div class="wp-block-columns">
<!-- wp:column {"width":"70%"} -->
<div class="wp-block-column" style="flex-basis:70%">
<!-- wp:group {"style":{"spacing":{"blockGap":"32px"}},"layout":{"type":"flex","flexWrap":"wrap"}} -->
<div class="wp-block-group">
<!-- wp:site-logo {"shouldSyncIcon":false} /-->
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","orientation":"vertical","flexWrap":"nowrap"}} -->
<div class="wp-block-group"><!-- wp:navigation -->
<!-- /wp:navigation -->
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","orientation":"vertical","flexWrap":"nowrap"}} -->
<div class="wp-block-group">
<!-- wp:navigation /-->
<!-- wp:navigation /-->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:column -->
<!-- wp:navigation -->
<!-- /wp:navigation --></div>
<!-- /wp:group --></div>
<!-- /wp:group --></div>
<!-- /wp:column -->
<!-- wp:column {"style":{"spacing":{"blockGap":"16px"}}} -->
<div class="wp-block-column">
<!-- wp:group {"style":{"spacing":{"blockGap":"4px"}},"layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group">
<!-- wp:paragraph {"fontSize":"medium"} -->
<p class="has-medium-font-size"><strong>Join our community</strong></p>
<!-- /wp:paragraph -->
<!-- wp:column {"style":{"spacing":{"blockGap":"16px"}}} -->
<div class="wp-block-column"><!-- wp:group {"style":{"spacing":{"blockGap":"4px"}},"layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group"><!-- wp:paragraph {"fontSize":"medium"} -->
<p class="has-medium-font-size"><strong>Join our community</strong></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph {"style":{"typography":{"fontSize":"14px"}}} -->
<p style="font-size:14px">Learn about new products and discounts!</p>
<!-- /wp:paragraph -->
</div>
<!-- /wp:group -->
<!-- wp:paragraph {"style":{"typography":{"fontSize":"14px"}}} -->
<p style="font-size:14px">Learn about new products and discounts!</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->
<!-- wp:social-links {"className":"is-style-logos-only"} -->
<ul class="wp-block-social-links is-style-logos-only"><!-- wp:social-link {"service":"facebook"} /-->
<!-- wp:social-link {"service":"instagram"} /-->
<!-- wp:social-link {"service":"twitter"} /--></ul>
<!-- /wp:social-links --></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"0px","right":"0px","bottom":"0px","left":"0px"},"blockGap":"16px"}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"center"}} -->
<div class="wp-block-group alignfull" style="padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px"><!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"center"}} -->
<div class="wp-block-group"><!-- wp:paragraph {"style":{"typography":{"fontSize":"12px"}}} -->
<p style="font-size:12px">@ 2022</p>
<!-- /wp:paragraph -->
<!-- wp:site-title {"style":{"typography":{"fontStyle":"normal","fontWeight":"400","fontSize":"12px"}}} /--></div>
<!-- /wp:group -->
<!-- wp:paragraph {"style":{"typography":{"fontSize":"14px"}}} -->
<p style="font-size:14px"><em>Built with <a href="https://woocommerce.com/">WooCommerce</a> </em></p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- wp:social-links {"className":"is-style-logos-only"} -->
<ul class="wp-block-social-links is-style-logos-only">
<!-- wp:social-link {"service":"facebook"} /-->
<!-- wp:social-link {"service":"instagram"} /-->
<!-- wp:social-link {"service":"twitter"} /-->
</ul>
<!-- /wp:social-links -->
</div>
<!-- /wp:column -->
</div>
<!-- /wp:columns -->
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"0px","right":"0px","bottom":"0px","left":"0px"},"blockGap":"16px"}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"center"}} -->
<div class="wp-block-group alignfull" style="padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px">
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"center"}} -->
<div class="wp-block-group">
<!-- wp:paragraph {"style":{"typography":{"fontSize":"12px"}}} -->
<p style="font-size:12px">@ 2022</p>
<!-- /wp:paragraph -->
<!-- wp:site-title {"style":{"typography":{"fontStyle":"normal","fontWeight":"400","fontSize":"12px"}}} /-->
</div>
<!-- /wp:group -->
<!-- wp:paragraph {"style":{"typography":{"fontSize":"14px"}}} -->
<p style="font-size:14px"><em>Built with <a href="https://woocommerce.com/">WooCommerce</a> </em></p>
<!-- /wp:paragraph -->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:group -->

27
plugins/woocommerce-blocks/patterns/header-essential-dark.php
View File

@ -6,16 +6,21 @@
* Block Types: core/template-part/header
*/
?>
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"1rem","bottom":"1rem","right":"1rem","left":"1rem"},"blockGap":"1rem"},"elements":{"link":{"color":{"text":"var:preset|color|background"}}}},"backgroundColor":"black","textColor":"white","className":"has-background-color","layout":{"type":"flex","flexWrap":"wrap","justifyContent":"space-between"}} -->
<div class="wp-block-group alignfull has-background-color has-white-color has-black-background-color has-text-color has-background has-link-color" style="padding-top:1rem;padding-right:1rem;padding-bottom:1rem;padding-left:1rem"><!-- wp:group {"style":{"spacing":{"blockGap":"2rem"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"left"}} -->
<div class="wp-block-group"><!-- wp:site-logo {"shouldSyncIcon":false} /-->
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"right":"2%","bottom":"32px","left":"2%","top":"32px"},"margin":{"top":"0px","bottom":"0px"}},"elements":{"link":{"color":{"text":"var:preset|color|background"}}}},"backgroundColor":"black","textColor":"white","className":"sticky-header has-background-color","layout":{"type":"flex","flexWrap":"wrap","justifyContent":"space-between"}} -->
<div class="wp-block-group alignfull sticky-header has-background-color has-white-color has-black-background-color has-text-color has-background has-link-color" style="margin-top:0px;margin-bottom:0px;padding-top:32px;padding-right:2%;padding-bottom:32px;padding-left:2%">
<!-- wp:group {"style":{"spacing":{"blockGap":"40px"}},"layout":{"type":"flex","flexWrap":"wrap"}} -->
<div class="wp-block-group">
<!-- wp:site-logo {"shouldSyncIcon":false} /-->
<!-- wp:search {"label":"Search","showLabel":false,"buttonText":"Search","buttonUseIcon":true} /-->
<!-- wp:navigation {"textColor":"background","layout":{"type":"flex","justifyContent":"center"}} /-->
</div>
<!-- /wp:group -->
<!-- wp:navigation {"textColor":"background","layout":{"type":"flex","justifyContent":"left"},"fontSize":"small"} /--></div>
<!-- /wp:group -->
<!-- wp:group {"style":{"spacing":{"padding":{"top":"1rem","bottom":"1rem"},"blockGap":"16px"},"typography":{"fontSize":"12px"}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"space-between"}} -->
<div class="wp-block-group" style="padding-top:1rem;padding-bottom:1rem;font-size:12px"><!-- wp:search {"label":"Search","showLabel":false,"placeholder":"Search","width":220,"widthUnit":"px","buttonText":"Search","buttonPosition":"no-button","buttonUseIcon":true} /-->
<!-- wp:woocommerce/mini-cart {"textColor":"background","style":{"typography":{"fontSize":"14px"}}} /--></div>
<!-- /wp:group --></div>
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"},"typography":{"fontSize":"18px"},"layout":{"selfStretch":"fill","flexSize":null}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"right"}} -->
<div class="wp-block-group" style="font-size:18px">
<!-- wp:woocommerce/customer-account {"displayStyle":"icon_only","iconStyle":"alt"} /-->
<!-- wp:woocommerce/mini-cart {"textColor":"background","style":{"typography":{"fontSize":"14px"}}} /-->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:group -->

27
plugins/woocommerce-blocks/patterns/header-essential.php
View File

@ -6,16 +6,21 @@
* Block Types: core/template-part/header
*/
?>
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"1rem","bottom":"1rem","right":"1rem","left":"1rem"},"blockGap":"1rem"}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"space-between"}} -->
<div class="wp-block-group alignfull has-link-color" style="padding-top:1rem;padding-right:1rem;padding-bottom:1rem;padding-left:1rem"><!-- wp:group {"style":{"spacing":{"blockGap":"2rem"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"left"}} -->
<div class="wp-block-group"><!-- wp:site-logo {"shouldSyncIcon":false} /-->
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"right":"2%","bottom":"32px","left":"2%","top":"32px"},"margin":{"top":"0px","bottom":"0px"}}},"className":"sticky-header","layout":{"type":"flex","flexWrap":"wrap","justifyContent":"space-between"}} -->
<div class="wp-block-group alignfull sticky-header" style="margin-top:0px;margin-bottom:0px;padding-top:32px;padding-right:2%;padding-bottom:32px;padding-left:2%">
<!-- wp:group {"style":{"spacing":{"blockGap":"40px"}},"layout":{"type":"flex","flexWrap":"wrap"}} -->
<div class="wp-block-group">
<!-- wp:site-logo {"shouldSyncIcon":false} /-->
<!-- wp:search {"label":"Search","showLabel":false,"width":100,"widthUnit":"%","buttonText":"Search","buttonUseIcon":true} /-->
<!-- wp:navigation {"layout":{"type":"flex","justifyContent":"center"}} /-->
</div>
<!-- /wp:group -->
<!-- wp:navigation {"layout":{"type":"flex","justifyContent":"left"},"fontSize":"small"} /--></div>
<!-- /wp:group -->
<!-- wp:group {"style":{"spacing":{"padding":{"top":"1rem","bottom":"1rem"},"blockGap":"16px"},"typography":{"fontSize":"13px"}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"space-between"}} -->
<div class="wp-block-group" style="padding-top:1rem;padding-bottom:1rem;font-size:13px"><!-- wp:search {"label":"Search","showLabel":false,"placeholder":"Search","width":220,"widthUnit":"px","buttonText":"Search","buttonPosition":"no-button","buttonUseIcon":true} /-->
<!-- wp:woocommerce/mini-cart {"style":{"typography":{"fontSize":"14px"}}} /--></div>
<!-- /wp:group --></div>
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"},"typography":{"fontSize":"18px"},"layout":{"selfStretch":"fill","flexSize":null}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"right"}} -->
<div class="wp-block-group" style="font-size:18px">
<!-- wp:woocommerce/customer-account {"displayStyle":"icon_only","iconStyle":"alt"} /-->
<!-- wp:woocommerce/mini-cart {"style":{"typography":{"fontSize":"14px"}}} /-->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:group -->

22
plugins/woocommerce-blocks/patterns/header-large-dark.php
View File

@ -7,15 +7,27 @@
*/
?>
<!-- wp:group {"align":"full","style":{"spacing":{"blockGap":"0px","padding":{"top":"1rem","right":"1rem","bottom":"1rem","left":"1rem"}},"elements":{"link":{"color":{"text":"var:preset|color|background"}}}},"backgroundColor":"black","textColor":"white","layout":{"type":"default"}} -->
<div class="wp-block-group alignfull has-background-color has-white-color has-black-background-color has-text-color has-background has-link-color" style="padding-top:1rem;padding-right:1rem;padding-bottom:1rem;padding-left:1rem"><!-- wp:group {"style":{"spacing":{"blockGap":"1rem"},"typography":{"fontSize":"13px"}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"right"}} -->
<div class="wp-block-group" style="font-size:13px"><!-- wp:search {"label":"Search","showLabel":false,"placeholder":"Search","width":220,"widthUnit":"px","buttonText":"Search","buttonPosition":"no-button","backgroundColor":"background"} /-->
<div class="wp-block-group alignfull has-background-color has-white-color has-black-background-color has-text-color has-background has-link-color" style="padding-top:1rem;padding-right:1rem;padding-bottom:1rem;padding-left:1rem">
<!-- wp:group {"style":{"spacing":{"blockGap":"1rem"}},"className":"has-small-font-size","layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"space-between"}} -->
<div class="wp-block-group has-small-font-size">
<!-- wp:search {"label":"Search","showLabel":false,"width":100,"widthUnit":"%","buttonText":"Search","buttonUseIcon":true} /-->
<!-- wp:woocommerce/mini-cart {"textColor":"background","style":{"typography":{"fontSize":"14px"}}} /--></div>
<!-- wp:group {"layout":{"type":"flex","flexWrap":"nowrap"}} -->
<div class="wp-block-group">
<!-- wp:woocommerce/customer-account {"displayStyle":"icon_only","fontSize":"small"} /-->
<!-- wp:woocommerce/mini-cart {"hasHiddenPrice":true,"style":{"typography":{"fontSize":"14px"}}} /-->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:group -->
<!-- wp:group {"style":{"spacing":{"blockGap":"16px","padding":{"top":"1rem","left":"0px","bottom":"2rem"}}},"layout":{"type":"flex","orientation":"vertical","justifyContent":"center"}} -->
<div class="wp-block-group" style="padding-top:1rem;padding-bottom:2rem;padding-left:0px"><!-- wp:site-logo {"shouldSyncIcon":true} /--></div>
<div class="wp-block-group" style="padding-top:1rem;padding-bottom:2rem;padding-left:0px">
<!-- wp:site-logo {"shouldSyncIcon":true} /-->
<!-- wp:site-title /-->
</div>
<!-- /wp:group -->
<!-- wp:navigation {"textColor":"background","layout":{"type":"flex","justifyContent":"center"}} /--></div>
<!-- wp:navigation {"textColor":"background","layout":{"type":"flex","justifyContent":"center"}} /-->
</div>
<!-- /wp:group -->

24
plugins/woocommerce-blocks/patterns/header-large.php
View File

@ -6,16 +6,28 @@
* Block Types: core/template-part/header
*/
?>
<!-- wp:group {"align":"full","style":{"spacing":{"blockGap":"0px","padding":{"top":"1rem","right":"1rem","bottom":"1rem","left":"1rem"}}},"layout":{"type":"default"}} -->
<div class="wp-block-group alignfull has-link-color" style="padding-top:1rem;padding-right:1rem;padding-bottom:1rem;padding-left:1rem"><!-- wp:group {"style":{"spacing":{"blockGap":"1rem"}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"right"},"fontSize":"small"} -->
<div class="wp-block-group has-small-font-size"><!-- wp:search {"label":"Search","showLabel":false,"placeholder":"Search","width":220,"widthUnit":"px","buttonText":"Search","buttonPosition":"no-button"} /-->
<!-- wp:group {"align":"full","style":{"spacing":{"blockGap":"0px","padding":{"top":"1rem","right":"1rem","bottom":"1rem","left":"1rem"}}},"className":"has-link-color","layout":{"type":"default"}} -->
<div class="wp-block-group alignfull has-link-color" style="padding-top:1rem;padding-right:1rem;padding-bottom:1rem;padding-left:1rem">
<!-- wp:group {"style":{"spacing":{"blockGap":"1rem"}},"className":"has-small-font-size","layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"space-between"}} -->
<div class="wp-block-group has-small-font-size">
<!-- wp:search {"label":"Search","showLabel":false,"width":100,"widthUnit":"%","buttonText":"Search","buttonUseIcon":true} /-->
<!-- wp:woocommerce/mini-cart {"style":{"typography":{"fontSize":"14px"}}} /--></div>
<!-- wp:group {"layout":{"type":"flex","flexWrap":"nowrap"}} -->
<div class="wp-block-group">
<!-- wp:woocommerce/customer-account {"displayStyle":"icon_only","fontSize":"small"} /-->
<!-- wp:woocommerce/mini-cart {"hasHiddenPrice":true,"style":{"typography":{"fontSize":"14px"}}} /-->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:group -->
<!-- wp:group {"style":{"spacing":{"blockGap":"16px","padding":{"top":"1rem","left":"0px","bottom":"2rem"}}},"layout":{"type":"flex","orientation":"vertical","justifyContent":"center"}} -->
<div class="wp-block-group" style="padding-top:1rem;padding-bottom:2rem;padding-left:0px"><!-- wp:site-logo {"shouldSyncIcon":true} /--></div>
<div class="wp-block-group" style="padding-top:1rem;padding-bottom:2rem;padding-left:0px">
<!-- wp:site-logo {"shouldSyncIcon":true} /-->
<!-- wp:site-title /-->
</div>
<!-- /wp:group -->
<!-- wp:navigation {"layout":{"type":"flex","justifyContent":"center"}} /--></div>
<!-- wp:navigation {"layout":{"type":"flex","justifyContent":"center"}} /-->
</div>
<!-- /wp:group -->

32
plugins/woocommerce-blocks/patterns/header-minimal-dark.php
View File

@ -7,17 +7,29 @@
*/
?>
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"right":"2%","bottom":"16px","left":"2%","top":"16px"},"margin":{"top":"0px","bottom":"0px"}},"elements":{"link":{"color":{"text":"var:preset|color|background"}}}},"backgroundColor":"black","textColor":"white","className":"sticky-header","layout":{"type":"flex","flexWrap":"wrap","justifyContent":"space-between"}} -->
<div class="wp-block-group alignfull sticky-header has-background-color has-white-color has-black-background-color has-text-color has-background has-link-color" style="margin-top:0px;margin-bottom:0px;padding-top:16px;padding-right:2%;padding-bottom:16px;padding-left:2%"><!-- wp:group {"style":{"spacing":{"blockGap":"40px"}},"layout":{"type":"flex","flexWrap":"wrap"}} -->
<div class="wp-block-group"><!-- wp:site-logo {"shouldSyncIcon":false} /--></div>
<!-- /wp:group -->
<div class="wp-block-group alignfull sticky-header has-background-color has-white-color has-black-background-color has-text-color has-background has-link-color" style="margin-top:0px;margin-bottom:0px;padding-top:16px;padding-right:2%;padding-bottom:16px;padding-left:2%">
<!-- wp:group {"style":{"spacing":{"blockGap":"40px"}},"layout":{"type":"flex","flexWrap":"wrap"}} -->
<div class="wp-block-group">
<!-- wp:site-logo {"shouldSyncIcon":false} /-->
<!-- wp:site-title /-->
</div>
<!-- /wp:group -->
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"},"typography":{"fontSize":"13px"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"right"}} -->
<div class="wp-block-group" style="font-size:13px"><!-- wp:group {"style":{"spacing":{"blockGap":"16px"}},"layout":{"type":"flex","flexWrap":"nowrap"},"fontSize":"small"} -->
<div class="wp-block-group has-small-font-size"><!-- wp:navigation {"textColor":"background","overlayMenu":"always","layout":{"type":"flex","justifyContent":"center"}} /-->
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"},"typography":{"fontSize":"13px"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"right"}} -->
<div class="wp-block-group" style="font-size:13px">
<!-- wp:group {"style":{"spacing":{"blockGap":"16px"}},"layout":{"type":"flex","flexWrap":"nowrap"},"fontSize":"small"} -->
<div class="wp-block-group has-small-font-size">
<!-- wp:navigation {"textColor":"background","overlayMenu":"always","layout":{"type":"flex","justifyContent":"center"}} /-->
<!-- wp:separator {"className":"is-style-wide"} -->
<hr class="wp-block-separator has-alpha-channel-opacity is-style-wide"/>
<!-- /wp:separator -->
</div>
<!-- /wp:group -->
<!-- wp:search {"label":"Search","showLabel":false,"placeholder":"Search store","width":220,"widthUnit":"px","buttonText":"Search","buttonPosition":"no-button"} /--></div>
<!-- /wp:group -->
<!-- wp:woocommerce/customer-account {"displayStyle":"icon_only","style":{"typography":{"fontSize":"16px"}}} /-->
<!-- wp:woocommerce/mini-cart {"textColor":"background","style":{"typography":{"fontSize":"13px"}}} /--></div>
<!-- /wp:group --></div>
<!-- wp:woocommerce/mini-cart {"textColor":"background","style":{"typography":{"fontSize":"13px"}}} /-->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:group -->

32
plugins/woocommerce-blocks/patterns/header-minimal.php
View File

@ -7,17 +7,29 @@
*/
?>
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"right":"2%","bottom":"16px","left":"2%","top":"16px"},"margin":{"top":"0px","bottom":"0px"}}},"className":"sticky-header","layout":{"type":"flex","flexWrap":"wrap","justifyContent":"space-between"}} -->
<div class="wp-block-group alignfull sticky-header" style="margin-top:0px;margin-bottom:0px;padding-top:16px;padding-right:2%;padding-bottom:16px;padding-left:2%"><!-- wp:group {"style":{"spacing":{"blockGap":"40px"}},"layout":{"type":"flex","flexWrap":"wrap"}} -->
<div class="wp-block-group"><!-- wp:site-logo {"shouldSyncIcon":false} /--></div>
<!-- /wp:group -->
<div class="wp-block-group alignfull sticky-header" style="margin-top:0px;margin-bottom:0px;padding-top:16px;padding-right:2%;padding-bottom:16px;padding-left:2%">
<!-- wp:group {"style":{"spacing":{"blockGap":"40px"}},"layout":{"type":"flex","flexWrap":"wrap"}} -->
<div class="wp-block-group">
<!-- wp:site-logo {"shouldSyncIcon":false} /-->
<!-- wp:site-title /-->
</div>
<!-- /wp:group -->
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"},"typography":{"fontSize":"13px"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"right"}} -->
<div class="wp-block-group" style="font-size:13px"><!-- wp:group {"style":{"spacing":{"blockGap":"16px"}},"layout":{"type":"flex","flexWrap":"nowrap"}} -->
<div class="wp-block-group"><!-- wp:navigation {"overlayMenu":"always","layout":{"type":"flex","justifyContent":"center"}} /-->
<!-- wp:group {"style":{"spacing":{"blockGap":"8px"},"typography":{"fontSize":"13px"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"right"}} -->
<div class="wp-block-group" style="font-size:13px">
<!-- wp:group {"style":{"spacing":{"blockGap":"16px"}},"layout":{"type":"flex","flexWrap":"nowrap"}} -->
<div class="wp-block-group">
<!-- wp:navigation {"overlayMenu":"always","layout":{"type":"flex","justifyContent":"center"}} /-->
<!-- wp:separator {"className":"is-style-wide"} -->
<hr class="wp-block-separator has-alpha-channel-opacity is-style-wide"/>
<!-- /wp:separator -->
</div>
<!-- /wp:group -->
<!-- wp:search {"label":"Search","showLabel":false,"placeholder":"Search store","width":220,"widthUnit":"px","buttonText":"Search","buttonPosition":"no-button"} /--></div>
<!-- /wp:group -->
<!-- wp:woocommerce/customer-account {"displayStyle":"icon_only","style":{"typography":{"fontSize":"16px"}}} /-->
<!-- wp:woocommerce/mini-cart {"style":{"typography":{"fontSize":"14px"}}} /--></div>
<!-- /wp:group --></div>
<!-- wp:woocommerce/mini-cart {"style":{"typography":{"fontSize":"14px"}}} /-->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:group -->

2
plugins/woocommerce-blocks/src/BlockTypes/CustomerAccount.php
View File

@ -67,7 +67,7 @@ class CustomerAccount extends AbstractBlock {
}
if ( self::DISPLAY_ALT === $attributes['iconStyle'] ) {
return '<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18" width="16" height="16">
return '<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18" width="18" height="18">
<path
d="M9 0C4.03579 0 0 4.03579 0 9C0 13.9642 4.03579 18 9 18C13.9642 18 18 13.9642 18 9C18 4.03579 13.9642 0 9
0ZM9 4.32C10.5347 4.32 11.7664 5.57056 11.7664 7.08638C11.7664 8.62109 10.5158 9.85277 9 9.85277C7.4653