6 Commits
Author | SHA1 | Message | Date |
---|---|---|---|
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 |
|
Tarun Vijwani | 29b4217f15 |
Update the border colors in the Cart and Checkout blocks (https://github.com/woocommerce/woocommerce-blocks/pull/11474)
* Change border color to Gutenberg 100 for Cart and Checkout blocks * Change form input color to Gutenberg 900 for Cart and Checkout blocks * Fix additional border colors of Checkout block * Update borders and form field colors in Cart Block * Change border color to $universal-border-light * Change border color for cart line items to $universal-border-light * Change form input fields border color to $universal-border-dark - Add $universal-border-dark color variable for woocommerce/woocommerce-blocks#1e1e1e on white. * Fix colors of text area border and form steps * Change form input fields border color to $universal-border-dark - Add $universal-border-dark color variable for woocommerce/woocommerce-blocks#1e1e1e on white. * Fix form steps * Update universal dark border rgba value - Update universal dark border rgba value from rgba(0, 0, 0, 0.882) to rgba(17, 17, 17, .80) to keep it consistent with universal-border colors * Update $universal-border-light color * Update the opacity of the borders * Update the border color to rgba (17, 17, 17, 0.12) * Roll back $universal-border-light value to the original value: 0.115 * Remove Opacity and pass it as argument in with-translucent-border - We have with-translucent-border option that accepts border and opacity for pseudo elements. * Remove additional spaces * Replace with-translucent-border with normal border - Since we're are not mixing the opacity to the border color so we don't need to use mixin with-translucent-border. * Fix applied css and add low contrast Color usage details - Fix minor CSS as per the standards. - Add comments for universal border colors that they're low contrast colors and should be used for decorative elements only * Fix border gap and double border for multiple shipping packages * Fix payment method borders and Cart line items borders - Change border bottom to border-top for cart line items. - Fix payment method radio control borders. * Fix local pickup border - Local pickup was using with-translucent-borders so it has some opacity, changed it to border-bottom. * Add border-bottom to cart items * Remove additional border from Cart items * Fix radio and checkbox borders as per the design * Fix shipping method borders and background color as per the design. * Force align left on the description for the local pickup options. * Update border color in quantity selector component * Fix Shipping options radio selection alignment - Add left padding to wc-block-components-shipping-rates-control__package element. * Update colors and variables * Change checkbox and radio button colors - Change checkbox and radio button colors from rgba(25, 23, 17, 0.3) to rgba(25, 23, 17, 0.48). * Remove bottom property from express payment style |
|
Tom Cafferkey | 0f59e3f698 |
Checkout block: Full width Place Order button when Return To Cart link is disabled. (https://github.com/woocommerce/woocommerce-blocks/pull/9721)
* When the Return To Cart link is disabled, make Place Order button full width * Optional prop fullWidth has undefined type added to it |
|
Tarun Vijwani | e39a27bd74 |
Add theme-level global styles to Cart and Checkout block (https://github.com/woocommerce/woocommerce-blocks/pull/8809)
* Dummy commit to open a PR * Revert the last change * Ensure Checkout block supports the theme-level global styles for `Colors » Buttons` (https://github.com/woocommerce/woocommerce-blocks/pull/8844) * Add GS support for button colors in Checkout block * Sync button hover effect with GB * Fix link margin/padding (https://github.com/woocommerce/woocommerce-blocks/pull/8908) * Replace <AddToCartButton /> with <ProductButton /> (https://github.com/woocommerce/woocommerce-blocks/pull/8914) * Add GS support for button typography in Checkout block (https://github.com/woocommerce/woocommerce-blocks/pull/8918) * Ensure Checkout block supports the theme-level global styles for Typography » Buttons (https://github.com/woocommerce/woocommerce-blocks/pull/8892) * Remove classname from cart image to avoid conflicts (https://github.com/woocommerce/woocommerce-blocks/pull/8898) Co-authored-by: Niels Lange <info@nielslange.de> * Use consistent and semantically correct HTML elements in the Cart and Checkout blocks (https://github.com/woocommerce/woocommerce-blocks/pull/9065) * Allow button height to adjust * Ensure to display full width heading background * Inherit font style and font weight for headings * Inherit font style and font weight for textarea * Inherit font family and font weight for buttons --------- Co-authored-by: Niels Lange <info@nielslange.de> Co-authored-by: Mike Jolley <mike.jolley@me.com> |
|
Mike Jolley | 9e00b015fc |
New contexts for `StoreNoticesContainer` and notice grouping (https://github.com/woocommerce/woocommerce-blocks/pull/7711)
* Refactor Store Notices Move snackbar hiding filter before notice creation Implements showApplyCouponNotice Refactor context providers Use STORE_NOTICE_CONTEXTS use refs to track notice containers Refactor ref usage Use existing noticeContexts * Move new notice code to checkout package * Combine store and snackbars * Update noticeContexts imports * Remove context provider * Update data store * Fix 502 * Add new error contexts * Force types * Unnecessary reorder of imports * Fix global handling * Document forceType * Optional props are undefined * Remove function name * Missing condition * Remove context prop * Define ACTION_TYPES * Remove controls * Update assets/js/base/context/event-emit/utils.ts Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com> * CONTACT_INFORMATION * Remove ref from registerContainer * Abstract container locating methods * pass context correctly when displaying notices * Remove debugging buttons * Update filter usage - remove useMemo so filter can work inline * Refactor existing error notices from the API (https://github.com/woocommerce/woocommerce-blocks/pull/7728) * Update API type defs * Move create notice utils * Replace useCheckoutNotices with new contexts * processCheckoutResponseHeaders should check headers are defined * Scroll to error notices only if we're not editing a field * Error handling utils * processErrorResponse when pushing changes * processErrorResponse when processing checkout * remove formatStoreApiErrorMessage * Add todo for cart errors * Remove unused deps * unused imports * Fix linting warnings * Unused dep * Update assets/js/types/type-defs/api-response.ts Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com> * Add todo * Use generic * remove const * Update array types * Phone should be in address blocks Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com> * Update store name to wc/store/store-notices * Fix assertResponseIsValid * Funnel woocommerce_rest_invalid_email_address to the correct place * woocommerce_rest_missing_email_address * Move comments around * Move data back into const * Spacing * Remove spacing * Remove forced snack bar and styling * Move notices within wrapper * Remove type * hasStoreNoticesContainer rename * Group by status/context * Remove global context * Remove white space * remove changes to simplify diff * white space * Move comment to typescript * List style * showApplyCouponNotice docs * See if scrollIntoView exists * fix notice tests Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com> |
|
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> |