Commit Graph

11 Commits

Author SHA1 Message Date
Niels Lange 93214eeb2b
[Enhancement]: Block-based checkout input fields style updates (#46362)
* Adjust border and box-shadow color for textual inputs

* WIP: Style checkboxes

* Vertically center checkmark

* Adjust focus outline width

* Adjust selected checkbox background in light mode

* Adjust background color of selected radio button

* Add chevron icon to dropdown fields

* Add changelog

* Fix CSS lint issues

* Adjust outline width

* Revert checkbox styles

* Adjust input field height and label size

* Revert box-shadow styles

* Add spacing between coupon title and coupon code

* Simplify onFocus and onBlur

* Fix outline width when focusing combobox

* Ensure chevron points down after selecting value

* Adjust outline color of focused delivery option

* POC: Use currentColor for focus states
2024-06-03 18:46:08 +07:00
Niels Lange 5168a21920
Block-based checkout - Update address fields display logic (#47160)
* Add “Address line 2” toggle

* Allow apartment field to be required

* Add changefile(s) from automation for the following project(s): woocommerce-blocks

* Rename “Apartment, suite, etc.” to “Address line 2”

* Remove unused dependency

* Add key to fragment

* Simplify keys

* Address failing e2e tests

* Change “Optional (Recommended)” to “Optional”

* Toggle address line 2 visibility in editor

* Add e2e tests

* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce

* Update e2e tests

* Update e2e tests

* Ensure the address 2 field stays open when the seller empties it

* Optimise hasAddress2FieldValue

* Move address 2 filed related functionality into separate component

* Rmove + sign from address 2 field links

* WIP: Introduce AddressField component

* Update AddressFields component

* Refactor AddressFields and Address2Field components

* Fix CSS lint error

* Fix JS lint error

* Fix failing e2e tests

* Fix typo in e2e tests

* Improve e2e selector

* Fix core e2e tests

* Use address line 2 label for the link text

* Lazy initialise the “isFieldVisible” state

* Remove obsolete code

* Add inline comments for clarity

* Fix JS lint error

* Improve e2e tests

* Revert "Remove obsolete code"

This reverts commit 027d6adc89.

* Adjust visibility toggle

* Delete obsolete changelog file

* Add inline comment

* Fix TS error

* Remove obsolete parts

* Solve TS warning

* Remove obsolete “fieldsRef”

* Remove obsolete “setHasFieldBeenModified”

* Address various TS warnings

* Fix link styling issue on mobile

* Fix JS lint error

* Refactor and simplify address components

* Optimise Address2Field component

* Improve inline docs

* Move ‘+’ from CSS to i18n

* Rename rest of values and pass correct onChange

* force component to remount

* remove unsed useEffect

---------

Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Nadir Seghir <nadir.seghir@gmail.com>
2024-05-21 15:48:24 +07:00
Seghir Nadir 76a9e2eb27
Move country to top of form for all countries (#47375)
* Move country to top of form for all countries

* adjust styling

* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-05-13 16:24:40 +02:00
Niels Lange b6d9b3a013
Fix broken checkout address forms layout (#47131)
* Fix broken checkout address forms layout

* Add changefile(s) from automation for the following project(s): woocommerce-blocks

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-05-08 10:30:12 +07:00
Tarun Vijwani 4e6476a996
Adjust spacing in/between elements on the Cart and Checkout block pages (#44160)
* Add spacing in Checkout block page

* Add spacing in Order summary block

* Update responsive styles for order summary panel

* Update styles for cart and cart line items table

* Update styles for order summary and cross-sells products

* Remove unnecessary CSS styles from cart line items table and cart block

* Remove unused CSS class from cart line items table

* Fix linting errors

* Add changelog

* Fix changelog lint

* Update quantity selector style

* Increase the line-height of the set description and remove margin top from email field

* Add margin-top to order summary image and express payment margin adjustment

* Update styles for cart and checkout components

* Fix linting error

* Fix margin units in cart-cross-sells-products

* Replace em with px

* Add margin-top to payment method container

* Update styles for Cart block for mobile screen

* Update padding in cart style.scss
2024-02-17 01:50:11 +04:00
Seghir Nadir 8ecfcfb9a0
Add Checkbox support for Additional Fields in Checkout Block (#42780)
* Introduce Additional Fields API for Checkout Block https://github.com/woocommerce/woocommerce-blocks/pull/12073

* revert test to what it was

* Default to text, if the type supplied is not supported throw an error

* Add type for options

* Return null if somehow the select made it through without options

* Make select fields type enum and add options to schema

* Lint fixes

* Update plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/address-form/address-form.tsx

Co-authored-by: Niels Lange <info@nielslange.de>

* Update plugins/woocommerce/src/Blocks/Domain/Services/CheckoutFields.php

Co-authored-by: Niels Lange <info@nielslange.de>

* Update checks to log errors and fail gracefully

* Add field id to class names

* Fix lint error

* Fix short array use

* Introduce Additional Fields API for Checkout Block https://github.com/woocommerce/woocommerce-blocks/pull/12073

* Default to text, if the type supplied is not supported throw an error

* Lint fixes

* Introduce Additional Fields API for Checkout Block https://github.com/woocommerce/woocommerce-blocks/pull/12073

* add support for registering checkboxes

* remove extra error log

* add styling

* fix rebase conflit

* fix rebase conflit 2

* fix linter errors

* address review comments

* add warning for checkbox

* fix changes

---------

Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
Co-authored-by: Niels Lange <info@nielslange.de>
2023-12-18 13:21:36 +01:00
Thomas Roberts 0c6a943c42
Add select field type for custom checkout fields (#42758)
Co-authored-by: Niels Lange <info@nielslange.de>
Co-authored-by: Nadir Seghir <nadir.seghir@gmail.com>
Co-authored-by: github-actions <github-actions@github.com>
2023-12-15 06:39:22 -08:00
Saad Tarhi 2182457673 Fix the Layout for Shipping and Billing Address Forms in the Checkout Block (https://github.com/woocommerce/woocommerce-blocks/pull/11486)
* Fix empty spaces in the address form

* Fix checkout layout for Japan and Hungary

* Added some comments in CSS
2023-11-10 08:07:49 +01:00
Mike Jolley c8b8b7232d Checkout Field Padding and Spacing (https://github.com/woocommerce/woocommerce-blocks/pull/11207)
* Spacing values

* Unused opacity rule
2023-10-13 12:13:50 +01:00
Mike Jolley 2d530a7d5e Refactor ValidatedTextInput and AddressForm usage (https://github.com/woocommerce/woocommerce-blocks/pull/10309)
* Refactor ValidatedTextInput and AddressForm usage

* Remove formatting from onChange

* update useeffect dependencies

* Update validation text

* Style fields without floats (https://github.com/woocommerce/woocommerce-blocks/pull/10310)
2023-08-03 12:02:20 +01:00
Thomas Roberts a46f13c6c5 Move Checkout block attributes into metadata (`block.json`) (https://github.com/woocommerce/woocommerce-blocks/pull/5594)
* Add block title to AbstractBlock class

* Add block title to Checkout block

* Include all block.json files in tsconfig

* Add get_block_title method to Checkout.php

* Remove redundant block_title field

* Add block.json and remove static attributes from attributes.ts

* Register block using attributes from block.json

* Add metadata_path to AbstractBlock

* Add function to AssetsApi to get the metadata path from the plugin root

* Register the block using metadata if it's set in the block's class

* Remove get_block_title method

* Only add supports and attributes to the block when not registering with metadata

* Change get_block_metadata to get_block_metadata_path

* Change indentation to tabs in block.json

* Update comment to clarify why attributes and supports are set later

* Check if path to metadata is not empty instead of set and not empty

* Move checkout block out of cart-checkout directory

* Update get_block_metadata_path function to find block.json automatically

* Remove metadata path from AbstractBlock

* Check if there's a metadata file and register blocks with metadata if so

* Move deprecated attributes out of metadata and into attributes.ts

* Re-add deprecated attributes to checkout index

* Move order notes test

* Move test for checkout phone number in edito

* Fix indentation in checkout/block.json

* Move checkout terms tests

* Try forcing storefront theme in e2e tests

* Revert "Try forcing storefront theme in e2e tests"

This reverts commit 5b0fd47a2c39aadb0141a4ed28cbc0e6baa89625.

* Try capturing screenshot on test failures

* Try uploading error in try catch

* Try uploading artefacts on error

* Test uploading artefacts

* Screenshot just before looking for edit post layout

* Revert "Screenshot just before looking for edit post layout"

This reverts commit 61dff027789ce13a0d84e7b6f11e431637c5a450.

* Revert "Test uploading artefacts"

This reverts commit adf5cc55bcdb677f889bf5a62803b4150d98e665.

* Revert "Try uploading artefacts on error"

This reverts commit 7441a832a113a95fef89cc1b8db6dc79271be516.

* Revert "Try uploading error in try catch"

This reverts commit ca412ce505d56286b164f588a201a451f6bceeb6.

* Revert "Try capturing screenshot on test failures"

This reverts commit 0de6e97df19b116091a7bb3b8652713867d2d80f.

Co-authored-by: Alex Florisca <alex.florisca@automattic.com>
2022-01-28 16:37:06 +00:00