This repository has been archived by the owner on Feb 23, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 219
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'trunk' into fix/11293-pattern-tt4-footer-with-2-menus-dark
- Loading branch information
Showing
7 changed files
with
292 additions
and
12 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,123 @@ | ||
| # Testing notes and ZIP for release 11.4.2 | ||
|
|
||
| Zip file for testing: [woocommerce-gutenberg-products-block.zip](https://github.com/woocommerce/woocommerce-blocks/files/13179867/woocommerce-gutenberg-products-block.zip) | ||
|
|
||
| ## WooCommerce Core | ||
|
|
||
| ### Enhancements | ||
|
|
||
| #### Improve the button size on the "Product Collection 4 Column" pattern. [11433](https://github.com/woocommerce/woocommerce-blocks/pull/11433) | ||
|
|
||
| 1. Create a new page or post. | ||
| 2. Insert the `Product Collection 4 Column` pattern. | ||
| 3. Check the `Add to cart` buttons look like in the after screenshot below. | ||
|
|
||
| | Before | After | | ||
| | ------ | ----- | | ||
| | <img width="1201" alt="Screenshot 2023-10-24 at 15 53 25" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/cc60d499-51b9-4a12-8f11-6c346eb41ce8"> | <img width="1197" alt="Screenshot 2023-10-24 at 15 53 01" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/a1735c13-f701-46e4-bbe0-b2b2eff275bf"> | | ||
|
|
||
| #### Improve the "Minimal header" pattern spacing and title. [11434](https://github.com/woocommerce/woocommerce-blocks/pull/11434) | ||
|
|
||
| 1. Create a new page or post and insert the `Minimal header` pattern. | ||
| 2. Check it matches the screenshot below. | ||
|
|
||
| | Mobile | | ||
| | ------ | | ||
| | <img width="405" alt="Screenshot 2023-10-24 at 16 50 08" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/5e124511-6098-4bc2-a381-9714e254a692"> | | ||
|
|
||
| | Desktop | | ||
| | ------ | | ||
| | <img width="1374" alt="Screenshot 2023-10-24 at 16 49 43" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/2c58a2ca-d270-4145-b1f6-19aa9a884a52"> | | ||
|
|
||
| ### Improve the Testimonials 3 columns pattern. [11430](https://github.com/woocommerce/woocommerce-blocks/pull/11430) | ||
|
|
||
| 1. Create a new page or post. | ||
| 2. Insert the `Testimonials 3 columns` pattern. | ||
| 3. Check the reviewer names are not duplicated. | ||
|
|
||
| | Before | After | | ||
| | ------ | ----- | | ||
| | <img width="1207" alt="Screenshot 2023-10-24 at 14 38 29" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/7c4a1f75-4eb1-4d7a-a38c-6e30d5649c18">| <img width="1201" alt="Screenshot 2023-10-24 at 14 37 42" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/8a967999-b16a-47f5-96ce-3d3b4c92a67e"> | | ||
|
|
||
| ### Add overlay to the "Featured Category Triple" pattern. [11428](https://github.com/woocommerce/woocommerce-blocks/pull/11428) | ||
|
|
||
| 1. Create a new page or post. | ||
| 2. Insert the `Featured Category Triple` pattern. | ||
| 3. Check each of the images have an overlay with 30% opacity. | ||
|
|
||
| | Before | After | | ||
| | ------ | ----- | | ||
| | <img width="967" alt="Screenshot 2023-10-24 at 14 14 29" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/91f35822-4ca3-4f11-9402-ba93ae80db5e"> | <img width="969" alt="Screenshot 2023-10-24 at 14 14 09" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/f460edf5-7659-4cc0-8d10-b4ae12dd1cd3"> | | ||
|
|
||
| ### Improve the "Footer with 3 Menus" pattern. [11379](https://github.com/woocommerce/woocommerce-blocks/pull/11379) | ||
|
|
||
| 1. Create a new page or post. | ||
| 2. Insert the `Footer with 3 menus` pattern. | ||
| 3. Check that it looks like the design. | ||
|
|
||
| | Desktop | | ||
| | ------ | | ||
| | <img width="1397" alt="Screenshot 2023-10-23 at 16 32 48" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/747643d2-7548-41d9-8ce1-8f91bcd1c171">| | ||
|
|
||
| | Mobile | | ||
| | ------ | | ||
| |<img width="334" alt="CleanShot 2023-10-23 at 16 33 30@2x" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/1d94f1ed-dad7-4b9b-ad9c-432acb16c2c2"> | | ||
|
|
||
| ### Update the "Large footer" pattern. [11413](https://github.com/woocommerce/woocommerce-blocks/pull/11413) | ||
|
|
||
| 1. Create a new page or post. | ||
| 2. Insert the `Large Footer` pattern. | ||
| 3. Check that it looks like the design. | ||
|
|
||
| | Desktop | | ||
| | ------ | | ||
| | <img width="1382" alt="Screenshot 2023-10-23 at 14 52 19" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/3ff9a4ff-f051-4023-9cb7-faf13da68062"> | | ||
|
|
||
| | Mobile | | ||
| | ------ | | ||
| | <img width="342" alt="Screenshot 2023-10-23 at 14 54 43" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/2926804a-8616-4d67-ae1c-e1340c814030"> | | ||
|
|
||
| ### Improve the "Essential Header". [11449](https://github.com/woocommerce/woocommerce-blocks/pull/11449) | ||
|
|
||
| 1. Create a new page or post and insert the `Essential Header`. | ||
| 2. Check it looks like the video below. | ||
|
|
||
| <video src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/fc3ba66b-1f9e-4cd2-96b1-c59f2aba1e80" /> | ||
|
|
||
| ### Improve the mobile view for the Minimal header pattern. [11463](https://github.com/woocommerce/woocommerce-blocks/pull/11463) | ||
|
|
||
| 1. Create a new page or post and insert the `Minimal header` pattern. | ||
| 2. Check the mobile view looks like the after screenshot below. | ||
|
|
||
| | Before | After | | ||
| | ------ | ----- | | ||
| | <img width="376" alt="Screenshot 2023-10-26 at 11 47 05" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/c1caac6a-c8d6-4144-8978-fe8c75fdd915"> | <img width="379" alt="Screenshot 2023-10-26 at 11 46 46" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/232cc433-a4ba-49b8-912f-bb53e2124713"> | | ||
|
|
||
| ### Update the Footer with simple menu and cart pattern. [11409](https://github.com/woocommerce/woocommerce-blocks/pull/11409) | ||
|
|
||
| 1. Create a new page or post. | ||
| 2. Insert the `Footer with simple menu and cart` pattern. | ||
| 3. Check that it looks like the design. | ||
|
|
||
| <img width="1752" alt="Screenshot 2023-10-24 at 10 50 05" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/a4118ee8-4c86-49d7-bd69-2402a000a4e2"> | ||
| <img width="537" alt="Screenshot 2023-10-24 at 10 51 13" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/28f69a93-41d0-4272-8766-5fda5a15e0b6"> | ||
| <img width="383" alt="Screenshot 2023-10-24 at 10 51 21" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/2e762e03-1928-4325-97fa-910408029cb2"> | ||
|
|
||
|
|
||
|
|
||
| ## Should be tested by the development team exclusively | ||
|
|
||
| ### Update the patterns content after a plugin update. [11210](https://github.com/woocommerce/woocommerce-blocks/pull/11210) | ||
|
|
||
| 1. Create a Jurassic Ninja site with WooCommerce. | ||
| 2. Connect JetPack. | ||
| 3. Install the plugin zip from this PR (<https://wcblocks.wpcomstaging.com/wp-content/uploads/woocommerce-gutenberg-products-block-11210.zip>) | ||
| 5. Install the [woo-ai](https://github.com/woocommerce/woocommerce-blocks/files/12882468/woo-ai.zip) plugin. | ||
| 6. Go to your store `/wp-admin/admin.php?page=wc-settings&tab=advanced§ion=features` and enter a description for your store (like `A store selling books and magazines`). | ||
|
|
||
| #### Simulating plugin update | ||
|
|
||
| 1. Go to the file editor and in WooCommerce Blocks plugin, in the `woocommerce-gutenberg-products-block.php` file modify the `woocommerce-gutenberg-products-block.php` plugin file and change the `* Version: 11.4.0-dev` comment to some lower version `* Version: 10`. | ||
| 2. Go to your store plugin's page, you should see the `WooCommerce Blocks` plugin with the version you just changed and a message to update the plugin. | ||
| 3. Click on it to update the plugin. | ||
| 4. Go to the Scheduled Actions and make sure a new `woocommerce_update_patterns_content` action is scheduled. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,122 @@ | ||
| # Testing notes and ZIP for release 11.4.3 | ||
|
|
||
| Zip file for testing: [woocommerce-gutenberg-products-block.zip](https://github.com/woocommerce/woocommerce-blocks/files/13217249/woocommerce-gutenberg-products-block.zip) | ||
|
|
||
| ## WooCommerce Core | ||
|
|
||
| ### Enhancements | ||
|
|
||
| #### Improve Hero Product Chessboard pattern [11423](https://github.com/woocommerce/woocommerce-blocks/pull/11423) | ||
|
|
||
| 1. Add a new post. | ||
| 2. Add the `Hero Product Chessbord` pattern. | ||
| 3. Save the page. | ||
| 4. Visit the saved page | ||
| 5. Ensure that the pattern looks like in the images below. | ||
|
|
||
| | Desktop | Mobile | | ||
| |--------|--------| | ||
| ||| | ||
|
|
||
| #### Fix spacing on the "Minimal header" pattern. [11477](https://github.com/woocommerce/woocommerce-blocks/pull/11477) | ||
|
|
||
| 1. Create a new page or post and insert the `Minimal header` pattern. | ||
| 2. Make sure there's no space at the right of the navigation block, as in the after screenshot below (note the blue color was added just to make it easier to visualize the space). | ||
|
|
||
| | Before | After | | ||
| | ------ | ----- | | ||
| | <img width="1381" alt="Screenshot 2023-10-27 at 11 51 26" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/9037fbc8-cc75-4b36-8ab7-ebd089dc81bf"> | <img width="1370" alt="Screenshot 2023-10-27 at 11 51 36" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/76dba159-e330-4cb0-9d5a-2640e3dae639"> | | ||
|
|
||
|
|
||
| #### "Product Gallery" improvements: remove product summary and update margins. [11464](https://github.com/woocommerce/woocommerce-blocks/pull/11464) | ||
|
|
||
| 1. Create a new page or post and insert the `Product Gallery` pattern. | ||
| 2. Check it does not include the product summary and looks like the screenshot. | ||
|  | ||
|
|
||
| #### "Product Collection X Columns" patterns: align "no reviews" text with the star. [11468](https://github.com/woocommerce/woocommerce-blocks/pull/11468) | ||
|
|
||
| 1. Add a post. | ||
| 2. Add the Product Collection 3 Columns pattern. | ||
| 3. Ensure that the "no reviews" text is aligned with the star. | ||
|
|
||
| | Before | After | | ||
| | ------ | ----- | | ||
| ||| | ||
|
|
||
| #### Enhance the Hero Product Split pattern. [11505](https://github.com/woocommerce/woocommerce-blocks/pull/11505) | ||
|
|
||
| 1. Create a new post | ||
| 2. Insert the Hero Product Split pattern | ||
| 3. Make sure things are working as expected on the editor side | ||
| 4. Save the post and access the frontend: make sure things are working as expected over there as well. | ||
|
|
||
| | Before | After | | ||
| | ------ | ----- | | ||
| | <img width="683" alt="Screenshot 2023-10-30 at 22 17 34" src="https://github.com/woocommerce/woocommerce-blocks/assets/15730971/56c6c94d-6151-4611-8db1-48da5412f857"> | <img width="683" alt="Screenshot 2023-10-30 at 22 17 50" src="https://github.com/woocommerce/woocommerce-blocks/assets/15730971/112c668f-b081-4d81-b9d4-c6072b67d838"> | | ||
|
|
||
| #### Simplify the Hero Product 3 Split pattern. [11495](https://github.com/woocommerce/woocommerce-blocks/pull/11495) | ||
|
|
||
| 1. Create a new page or post and insert the `Hero Product 3 Split` pattern. | ||
| 2. Save and check it looks good on desktop and mobile and looks like the screenshot below (ignore the broken image, it's due to how the screenshot was taken). | ||
|
|
||
| | Mobile | | ||
| | ------ | | ||
| |  | | ||
|
|
||
| | Desktop | | ||
| |--------| | ||
| | <img width="1184" alt="Screenshot 2023-10-30 at 15 35 10" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/c6b5bdc5-589a-4790-8b1d-023c2610de74">| | ||
|
|
||
| #### Product Search Block: unify border-radius. [11515](https://github.com/woocommerce/woocommerce-blocks/pull/11515) | ||
|
|
||
| 1. Add a new post. | ||
| 2. Add the `Footer with Simple Menu`. | ||
| 3. Save. | ||
| 4. Ensure that the patterns look okay on desktop and mobile (and match with the screenshot). | ||
| 5. Repeat 1-4 for each pattern that it is in the screenshot (use the title for searching the pattern in the inserter). | ||
|
|
||
|
|
||
|  | ||
|
|
||
| #### Improve the Centered Header Menu with Search pattern. [11304](https://github.com/woocommerce/woocommerce-blocks/pull/11304) | ||
|
|
||
| 1. Create a new page or post. | ||
| 2. Insert the `Centered Header Menu with Search` pattern. | ||
| 3. Check it looks like the screenshot below. | ||
| 4. Check all the elements are visible on mobile. | ||
|
|
||
| ⚠️ In the next release, we will update the pattern name: <https://github.com/woocommerce/woocommerce-blocks/issues/11523> | ||
|
|
||
|
|
||
| | Desktop | | ||
| |--------| | ||
| || | ||
|
|
||
| | Mobile | | ||
| |--------| | ||
| || | ||
|
|
||
| #### Large Header pattern: improve the layout on mobile view. [11490](https://github.com/woocommerce/woocommerce-blocks/pull/11490) | ||
|
|
||
| 1. Add a new post. | ||
| 2. Add the Large Header pattern. | ||
| 3. Save the post. | ||
| 4. Visit the saved post. | ||
| 5. Ensure that the pattern looks okay. | ||
| 6. Switch to the mobile view. | ||
| 7. Ensure that the pattern looks okay. | ||
|
|
||
|  | ||
|
|
||
| ### Mobile | ||
|
|
||
|  | ||
|
|
||
| #### Improve the "Large footer" spacing. [11520](https://github.com/woocommerce/woocommerce-blocks/pull/11520) | ||
|
|
||
| 1. Create a new page or post and insert the `Large footer` pattern. | ||
| 2. Check there's no space. | ||
|
|
||
|
|
||
| <img width="707" alt="Screenshot 2023-10-31 at 12 56 33" src="https://github.com/woocommerce/woocommerce-blocks/assets/186112/fa4c0335-9c13-44e1-a599-36ee21663e2c"> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,9 +1,9 @@ | ||
| <!-- wp:group {"tagName":"header","area":"header","metadata":{"name":"Checkout Header"},"layout":{"type":"constrained"}} --> | ||
| <header class="wp-block-group"> | ||
| <!-- wp:group {"layout":{"type":"constrained"}} --> | ||
| <div class="wp-block-group"> | ||
| <!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"bottom":"var:preset|spacing|40"}}},"layout":{"type":"flex","justifyContent":"space-between"}} --> | ||
| <div class="wp-block-group alignwide" style="padding-bottom:var(--wp--preset--spacing--40)"> | ||
| <!-- wp:site-title {"level":0} /--> | ||
| </div> | ||
| <!-- /wp:group --> | ||
| </header> | ||
| <!-- /wp:group --> | ||
| </div> | ||
| <!-- /wp:group --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters