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

Change the "chessboard" pattern structure to improve mobile view #11545

Merged
merged 2 commits into from
Nov 2, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
81 changes: 22 additions & 59 deletions patterns/hero-product-chessboard.php
Original file line number Diff line number Diff line change
Expand Up @@ -15,14 +15,10 @@
$first_title = $content['titles'][0]['default'] ?? '';
$second_title = $content['titles'][1]['default'] ?? '';
$third_title = $content['titles'][2]['default'] ?? '';
$fourth_title = $content['titles'][3]['default'] ?? '';
$fifth_title = $content['titles'][4]['default'] ?? '';

$first_description = $content['descriptions'][0]['default'] ?? '';
$second_description = $content['descriptions'][1]['default'] ?? '';
$third_description = $content['descriptions'][2]['default'] ?? '';
$fourth_description = $content['descriptions'][3]['default'] ?? '';
$fifth_description = $content['descriptions'][4]['default'] ?? '';
?>

<!-- wp:group {"align":"full","style":{"spacing":{"margin":{"top":"0px","bottom":"80px"}}},"layout":{"type":"constrained"}} -->
Expand All @@ -44,17 +40,16 @@
</div>
<!-- /wp:column -->


<!-- wp:column {"verticalAlignment":"center","style":{"spacing":{"padding":{"top":"0","right":"0","bottom":"0","left":"0"}}},"layout":{"type":"constrained"}} -->
<div class="wp-block-column is-vertically-aligned-center" style="padding-top:0;padding-right:0;padding-bottom:0;padding-left:0">
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"0px","right":"60px","bottom":"0px","left":"60px"},"margin":{"top":"var:preset|spacing|40","bottom":"var:preset|spacing|40"}}}} -->
<div class="wp-block-group alignfull" style="margin-top:var(--wp--preset--spacing--40);margin-bottom:var(--wp--preset--spacing--40);padding-top:0px;padding-right:60px;padding-bottom:0px;padding-left:60px">
<!-- wp:heading {"textAlign":"left","level":2} -->
<h2 class="wp-block-heading has-text-align-left has-large-font-size"><strong><?php echo esc_html( $fifth_title ); ?></strong></h3>
<h2 class="wp-block-heading has-text-align-left has-large-font-size"><strong><?php echo esc_html( $third_title ); ?></strong></h3>
<!-- /wp:heading -->

<!-- wp:paragraph {"style":{"spacing":{"margin":{"bottom":"var:preset|spacing|40"}}}} -->
<p style="margin-bottom:var(--wp--preset--spacing--40)"><?php echo esc_html( $fifth_description ); ?></p>
<p style="margin-bottom:var(--wp--preset--spacing--40)"><?php echo esc_html( $third_description ); ?></p>
<!-- /wp:paragraph -->

<!-- wp:buttons {"style":{"spacing":{"margin":{"top":"64px"}}}} -->
Expand All @@ -77,63 +72,31 @@
<div class="wp-block-columns alignfull are-vertically-aligned-center" style="margin-top:0;margin-bottom:0;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0">
<!-- wp:column {"verticalAlignment":"center","style":{"spacing":{"padding":{"top":"0","right":"0","bottom":"0","left":"0"}}}} -->
<div class="wp-block-column is-vertically-aligned-center" style="padding-top:0;padding-right:0;padding-bottom:0;padding-left:0">
<!-- wp:group {"style":{"spacing":{"padding":{"top":"50px","right":"50px","bottom":"50px","left":"50px"}}},"layout":{"type":"flex","orientation":"vertical"}} -->
<!-- wp:group {"style":{"spacing":{"padding":{"right":"50px","left":"50px","top":"50px","bottom":"50px"},"blockGap":"32px"}},"layout":{"type":"constrained"}} -->
<div class="wp-block-group" style="padding-top:50px;padding-right:50px;padding-bottom:50px;padding-left:50px">
<!-- wp:columns {"style":{"spacing":{"blockGap":{"left":"60px"}}}} -->
<div class="wp-block-columns">
<!-- wp:column -->
<div class="wp-block-column">
<!-- wp:heading {"level":4,"style":{"typography":{"textTransform":"capitalize"}, "spacing":{"margin":{"bottom":"16px"}}}} -->
<h4 class="wp-block-heading" style="text-transform:capitalize; margin-bottom:16px"><strong><?php echo esc_html( $second_title ); ?></strong></h4>
<!-- /wp:heading -->

<!-- wp:paragraph {"style":{"spacing":{"padding":{"top":"0","right":"0","bottom":"0","left":"0"},"margin":{"top":"var:preset|spacing|20","right":"0","bottom":"0","left":"0"}}}} -->
<p style="margin-top:var(--wp--preset--spacing--20);margin-right:0;margin-bottom:0;margin-left:0;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;"><?php echo esc_html( $second_description ); ?></p>
<!-- /wp:paragraph -->
</div>
<!-- /wp:column -->

<!-- wp:column -->
<div class="wp-block-column">
<!-- wp:heading {"level":4,"style":{"typography":{"textTransform":"capitalize"}, "spacing":{"margin":{"bottom":"16px"}}}} -->
<h4 class="wp-block-heading" style="text-transform:capitalize; margin-bottom:16px"><strong><?php echo esc_html( $third_title ); ?></strong></h4>
<!-- /wp:heading -->

<!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"var:preset|spacing|20"}}}} -->
<p style="margin-top:var(--wp--preset--spacing--20)"><?php echo esc_html( $third_description ); ?></p>
<!-- /wp:paragraph -->
</div>
<!-- /wp:column -->
<!-- wp:group {"style":{"spacing":{"blockGap":"16px"}},"layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group">
<!-- wp:heading {"level":6,"style":{"typography":{"textTransform":"capitalize"}}} -->
<h6 class="wp-block-heading" style="text-transform:capitalize"><strong><?php echo esc_html( $first_title ); ?></strong></h6>
<!-- /wp:heading -->

<!-- wp:paragraph {"style":{"spacing":{"padding":{"top":"0","right":"0","bottom":"0","left":"0"},"margin":{"top":"var:preset|spacing|20","right":"0","bottom":"0","left":"0"}}}} -->
<p style="margin-top:var(--wp--preset--spacing--20);margin-right:0;margin-bottom:0;margin-left:0;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0"><?php echo esc_html( $first_description ); ?></p>
<!-- /wp:paragraph -->
</div>
<!-- /wp:columns -->

<!-- wp:columns {"style":{"spacing":{"blockGap":{"left":"60px"}}}} -->
<div class="wp-block-columns">
<!-- wp:column -->
<div class="wp-block-column">
<!-- wp:heading {"level":4,"style":{"typography":{"textTransform":"capitalize"}, "spacing":{"margin":{"bottom":"16px"}}}} -->
<h4 class="wp-block-heading" style="text-transform:capitalize; margin-bottom:16px"><strong><?php echo esc_html( $fourth_title ); ?></strong></h4>
<!-- /wp:heading -->

<!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"var:preset|spacing|20"}}}} -->
<p style="margin-top:var(--wp--preset--spacing--20)"><?php echo esc_html( $fourth_description ); ?></p>
<!-- /wp:paragraph -->
</div>
<!-- /wp:column -->
<!-- /wp:group -->

<!-- wp:column -->
<div class="wp-block-column">
<!-- wp:heading {"level":4,"style":{"typography":{"textTransform":"capitalize"}, "spacing":{"margin":{"bottom":"16px"}}}} -->
<h4 class="wp-block-heading" style="text-transform:capitalize; margin-bottom:16px;"><strong><?php echo esc_html( $fifth_title ); ?></strong></h4>
<!-- /wp:heading -->
<!-- wp:group {"style":{"dimensions":{"minHeight":""},"spacing":{"blockGap":"16px"}},"layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group">
<!-- wp:heading {"level":6,"style":{"typography":{"textTransform":"capitalize"}}} -->
<h6 class="wp-block-heading" style="text-transform:capitalize"><strong><?php echo esc_html( $second_title ); ?></strong></h6>
<!-- /wp:heading -->

<!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"var:preset|spacing|20","right":"0","bottom":"0","left":"0"}}}} -->
<p style="margin-top:var(--wp--preset--spacing--20);margin-right:0;margin-bottom:0;margin-left:0"><?php echo esc_html( $fifth_description ); ?></p>
<!-- /wp:paragraph -->
</div>
<!-- /wp:column -->
<!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"var:preset|spacing|20"}}}} -->
<p style="margin-top:var(--wp--preset--spacing--20)"><?php echo esc_html( $second_description ); ?></p>
<!-- /wp:paragraph -->
</div>
<!-- /wp:columns -->
<!-- /wp:group -->
</div>
<!-- /wp:group -->
</div>
Expand Down
28 changes: 6 additions & 22 deletions src/Patterns/dictionary.json
Original file line number Diff line number Diff line change
Expand Up @@ -170,47 +170,31 @@
"images_format": "landscape",
"content": {
"titles": [
{
"default": "The Fall Collection",
"ai_prompt": "An impact phrase that advertises the displayed product: {image.0}"
},
{
"default": "Quality Materials",
"ai_prompt": "A title describing the first displayed product feature"
"ai_prompt": "A title describing the first displayed product feature. The title must have less than 20 characters."
},
{
"default": "Expert Craftsmanship",
"ai_prompt": "A title describing the second displayed product feature"
},
{
"default": "Unique Design",
"ai_prompt": "A title describing the third displayed product feature"
"ai_prompt": "A title describing the second displayed product feature. The title must have less than 20 characters."
},
{
"default": "Customer Satisfaction",
"ai_prompt": "A title describing the fourth displayed product feature"
"ai_prompt": "A title describing the fourth displayed product feature. The title must have less than 20 characters."
}
],
"descriptions": [
{
"default": "With high-quality materials and expert craftsmanship, our products are built to last and exceed your expectations.",
"ai_prompt": "A description of the product"
},
{
"default": "We use only the highest-quality materials in our products, ensuring that they look great and last for years to come.",
"ai_prompt": "A description of the first displayed product feature"
"ai_prompt": "A description of the first displayed product feature. The text must have less than 120 characters."
},
{
"default": "Our products are made with expert craftsmanship and attention to detail, ensuring that every stitch and seam is perfect.",
"ai_prompt": "A description of the second displayed product feature"
},
{
"default": "From bold prints and colors to intricate details and textures, our products are a perfect combination of style and function.",
"ai_prompt": "A description of the third displayed product feature"
"ai_prompt": "A description of the second displayed product feature. The text must have less than 120 characters."
},
{
"default": "Our top priority is customer satisfaction, and we stand behind our products 100%. ",
"ai_prompt": "A description of the fourth displayed product feature"
"ai_prompt": "A description of the fourth displayed product feature. The text must have less than 120 characters."
}
]
}
Expand Down
Loading