Skip to content
This repository has been archived by the owner on Feb 23, 2024. It is now read-only.

Commit

Permalink
improve layout
Browse files Browse the repository at this point in the history
  • Loading branch information
@gigitux
gigitux committed Mar 22, 2023
1 parent 960194a commit ba585ab
Show file tree
Hide file tree
Showing 3 changed files with 27 additions and 20 deletions.
4 changes: 3 additions & 1 deletion assets/js/atomic/blocks/product-elements/product-details/block.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,9 @@
"description": "A block that allows your customers to see details and reviews about the product.",
"category": "woocommerce",
"keywords": [ "WooCommerce" ],
"supports": {},
"supports": {
"align": true
},
"textdomain": "woo-gutenberg-products-block",
"apiVersion": 2,
"$schema": "https://schemas.wp.org/trunk/block.json"
Expand Down
9 changes: 7 additions & 2 deletions src/BlockTypes/ProductDetails.php
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
<?php

namespace Automattic\WooCommerce\Blocks\BlockTypes;
use Automattic\WooCommerce\Blocks\Utils\StyleAttributesUtils;


/**
* ProductDetails class.
Expand Down Expand Up @@ -34,10 +36,13 @@ protected function render( $attributes, $content, $block ) {

$classname = $attributes['className'] ?? '';

$classes_and_styles = StyleAttributesUtils::get_classes_and_styles_by_attributes( $attributes );

return sprintf(
'<div class="wp-block-woocommerce-product-details %1$s">
%2$s
'<div class="wp-block-woocommerce-product-details %1$s %2$s">
%3$s
</div>',
esc_attr( $classes_and_styles['classes'] ),
esc_attr( $classname ),
$tabs
);
Expand Down
34 changes: 17 additions & 17 deletions templates/templates/blockified/single-product.html
View file
Original file line number Diff line number Diff line change
@@ -1,31 +1,28 @@
<!-- wp:template-part {"slug":"header","tagName":"header"} /-->
<!-- wp:template-part {"slug":"header","theme":"twentytwentythree","tagName":"header"} /-->

<!-- wp:group {"layout":{"type":"constrained","contentSize":"1000px"}} -->
<!-- wp:group {"layout":{"inherit":true,"type":"constrained"}} -->
<div class="wp-block-group"><!-- wp:woocommerce/breadcrumbs /-->

<!-- wp:columns -->
<div class="wp-block-columns">
<!-- wp:column {"style":{"spacing":{"padding":{"top":"0","right":"0","bottom":"0","left":"0"}}},"layout":{"type":"constrained","justifyContent":"right"}} -->
<div class="wp-block-column" style="padding-top:0;padding-right:0;padding-bottom:0;padding-left:0">
<!-- wp:woocommerce/product-image-gallery /-->
</div>
<!-- wp:columns {"align":"wide"} -->
<div class="wp-block-columns alignwide"><!-- wp:column -->
<div class="wp-block-column"><!-- wp:woocommerce/product-image-gallery /--></div>
<!-- /wp:column -->

<!-- wp:column -->
<div class="wp-block-column">
<!-- wp:post-title {"__woocommerceNamespace":"woocommerce/product-query/product-title"} /-->

<!-- wp:post-excerpt {"__woocommerceNamespace":"woocommerce/product-query/product-summary"} /-->
<!-- wp:woocommerce/product-price {"isDescendentOfSingleProductTemplate":true, "fontSize":"large"} /-->

<!-- wp:woocommerce/product-price /-->
<!-- wp:post-excerpt {"__woocommerceNamespace":"woocommerce/product-query/product-summary"} /-->

<!-- wp:woocommerce/add-to-cart-form /-->

<!-- wp:woocommerce/product-meta -->
<div class="wp-block-woocommerce-product-meta">
<!-- wp:group {"layout":{"type":"flex","flexWrap":"nowrap"}} -->
<div class="wp-block-group">
<!-- wp:woocommerce/product-sku {"isDescendentOfSingleProductTemplate": true} /-->
<!-- wp:woocommerce/product-sku {"isDescendentOfSingleProductTemplate":true} /-->

<!-- wp:post-terms {"term":"product_cat","prefix":"Category: "} /-->

Expand All @@ -39,12 +36,15 @@
</div>
<!-- /wp:columns -->

<!-- wp:woocommerce/product-details /-->
<!-- wp:woocommerce/product-details {"align":"wide"} /-->

<!-- wp:woocommerce/related-products {"align":"wide"} -->
<div class="wp-block-woocommerce-related-products alignwide">
<!-- wp:query {"queryId":0,"query":{"perPage":5,"pages":0,"offset":0,"postType":"product","order":"asc","orderBy":"title","author":"","search":"","exclude":[],"sticky":"","inherit":false},"displayLayout":{"type":"flex","columns":5},"namespace":"woocommerce/related-products","lock":{"remove":true,"move":true}} -->
<div class="wp-block-query"><!-- wp:heading -->
<h2 class="wp-block-heading">Related products</h2>
<!-- /wp:heading -->

<!-- wp:woocommerce/related-products -->
<div class="wp-block-woocommerce-related-products">
<!-- wp:query {"queryId":2,"query":{"perPage":5,"pages":0,"offset":0,"postType":"product","order":"asc","orderBy":"title","author":"","search":"","exclude":[],"sticky":"","inherit":false},"displayLayout":{"type":"flex","columns":5},"namespace":"woocommerce/related-products","lock":{"remove":true,"move":true}} -->
<div class="wp-block-query">
<!-- wp:post-template {"__woocommerceNamespace":"woocommerce/product-query/product-template"} -->
<!-- wp:woocommerce/product-image {"isDescendentOfQueryLoop":true} /-->

Expand All @@ -61,4 +61,4 @@
</div>
<!-- /wp:group -->

<!-- wp:template-part {"slug":"footer","tagName":"footer"} /-->
<!-- wp:template-part {"slug":"footer","theme":"twentytwentythree","tagName":"footer"} /-->

0 comments on commit ba585ab

Please sign in to comment.