Commit Graph

27 Commits

Author SHA1 Message Date
Albert Juhé Lluveras a89a229b37 Prevent Mini-Cart table to show horizontal scrollbar (https://github.com/woocommerce/woocommerce-blocks/pull/9676) 2023-06-09 10:48:23 +02:00
Roy Ho 5f5a0d4b54 Stack cart and checkout buttons on smaller screens (https://github.com/woocommerce/woocommerce-blocks/pull/9603) 2023-05-30 13:07:30 -07:00
Albert Juhé Lluveras c267504bd6 Use a portal to render the Drawer close button to fix the alignment with the Mini-Cart Contents block (https://github.com/woocommerce/woocommerce-blocks/pull/9507) 2023-05-30 15:39:19 +02:00
Albert Juhé Lluveras a04c00a79f Make Mini-Cart block work well with caching plugins (https://github.com/woocommerce/woocommerce-blocks/pull/9493)
* Make Mini-Cart block work well with caching plugins

* Add tests

* Add back aria-label to Mini-Cart menu

* Fetch Mini-Cart data before page finishes loading

* Store and retrieve Mini-Cart values from localStorage for better performance

* Update styles as early as possible

* Reorder code

* Remove overrideTotals param from updateTotals() function

* Update tests

* Initialize local storage inside a function and add act to filter tests

* Replace void with undefined types in several funtions

* Fix 0 quantity badge appearing on page load
2023-05-23 09:28:40 +02:00
Albert Juhé Lluveras 3b28b74777 Mini Cart: stop using Modal component (https://github.com/woocommerce/woocommerce-blocks/pull/9345)
* Remove unused styles

* Replace usage of Modal component with custom Drawer

* Update MiniCart.php class structure

* Update tests

* Prevent focus styles to appear unnecessarily when opening the Mini Cart drawer

* Work-around issue with disabled buttons causing lose of focus inside the Mini-Cart drawer

* Revert "Work-around issue with disabled buttons causing lose of focus inside the Mini-Cart drawer"

This reverts commit 4360f77384ad1f1d90a3ba8a0385ad79da2449f2.

* QuantitySelector: focus text input field after decrease or increase button become disabled

* Move focus to the input field also when the body has focus, that fixes the issue in Chrome

* Add explanatory comment
2023-05-16 10:41:26 +02:00
Albert Juhé Lluveras 2b6eef516b Update Mini-Cart block editor sidebar (https://github.com/woocommerce/woocommerce-blocks/pull/9420)
* Update Mini-Cart block editor sidebar

* Rename Mini Cart block to Mini-Cart

* Update Mini-Cart block editor sidebar (II)

* Update two instances of mini-cart to uppercase
2023-05-11 14:52:03 +02:00
Albert Juhé Lluveras 0dae33e4b9 Use currentColor for Mini Cart footer border (https://github.com/woocommerce/woocommerce-blocks/pull/9245) 2023-04-26 16:59:35 +02:00
Albert Juhé Lluveras 779e13af15 Fix JS error visible in the editor caused by Mini Cart Contents buttons (https://github.com/woocommerce/woocommerce-blocks/pull/9039) 2023-04-14 16:53:39 +02:00
Alba Rincón 709a7a9add [Mini cart] Make the title customizable (https://github.com/woocommerce/woocommerce-blocks/pull/8905)
* Create the counter block and the header pattern

* Change the pattern to an inner block

* Allow customizing item counter block

* Rename block

* Allow removing the items counter block

* Add padding controls

* Preload new blocks

* Add title block back from the inserter

* Move h2 tag to the parent title

* Align items at the bottom

* Unify styles

* Add title class in the editor

* Prevent removing title blocks

* Disallow unlocking and inserter

* Disallowing moving blocks
2023-04-14 09:21:21 +02:00
Alba Rincón 2d9519b3ba Add style to the `Mini Cart` buttons (https://github.com/woocommerce/woocommerce-blocks/pull/8776)
* Create new car button inner block

* Create new checkout button inner block

* Render inner buttons on the frontend

* Fix buttons size

* Add outline to the cart button

* Add color props

* Add urls

* Fix button classes

* Add classes to edit

* Start using editable button

* Add buttons to mini cart tempalte

* Reorder buttons in template

* Add cart & checkout buttons scripts

* Remove unnecessary divs

* Change checkout button block name

* Change cart button block name

* Add deprecation to the buttons

* Fix lint and inline save

* Remove commented out code and fix condition

* Render buttons if no children

* Change migrate condition

* Simplify condition

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>

* Make props optional

* Add missing import

---------

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2023-03-23 16:55:53 +01:00
Alba Rincón d4fe2a5b5d Mini-cart: add setting to not render the block on the cart & checkout pages (https://github.com/woocommerce/woocommerce-blocks/pull/8700)
* Add `renderInCartAndCheckout` attribute and toggle

* Show setting only when inserted in a template

* Don't render the mini-cart if the setting is disabled

* Stop rendering the mini-cart if the setting is false

* method to snakecase

* Make the attribute a string

In the future we may want to add more rendering styles, so a boolean wasn't the
best option, a string will allowed us more than two options

* Change toggle copy
2023-03-14 15:59:46 +01:00
Albert Juhé Lluveras b64a6b8a5e Add spacing below Mini Cart title (https://github.com/woocommerce/woocommerce-blocks/pull/8676) 2023-03-14 09:42:53 +01:00
Alba Rincón 98f5f67ed1 Add border support to mini cart contents (https://github.com/woocommerce/woocommerce-blocks/pull/8654)
* Add border support to mini cart contents

* Fix buttons in firefox when logged out

* Fix mini cart in all browsers

* Fix border not visible on mobile because of the admin bar

* Add feature flag to the experimental border

---------

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2023-03-10 09:25:24 +01:00
Albert Juhé Lluveras f65a1afe15 Mini Cart drawer close button: inherit text color and improve alignment (https://github.com/woocommerce/woocommerce-blocks/pull/8605)
* Make Mini Cart drawer close button inherit the color

* Fix Mini Cart drawer close button alignment

* Increase opacity when Mini Cart drawer close icon is hover, focused or active
2023-03-09 09:28:55 +01:00
Roy Ho b9044a72df Add explicit CSS styling to mini-cart block amount in inserter preview (https://github.com/woocommerce/woocommerce-blocks/pull/8516)
* Add explicit CSS styling to mini-cart block amount in inserter preview

* Add preview specific class name

* Fix formatting
2023-02-28 09:40:06 -08:00
Daniel W. Robert 376bbc8993 Mini Cart block - Fix the drawer content height to allow checkout button to show. (https://github.com/woocommerce/woocommerce-blocks/pull/8351)
* Add max-height to Mini Cart drawer.

By giving the Mini Cart contents a max height with the
-webkit-fill-available property, we can ensure that the browser chrome
is accounted for on mobile devices.

* Add `dvh` and keep `vh` as a fallback for height.

By adding `dvh`, we also account for non-webkit mobile browsers that
have the same hidden button issue.

See
https://github.com/woocommerce/woocommerce-blocks/pull/8351#pullrequestreview-1278867767

Keeping `vh` as a fallback, along with `-webkit-fill-available` gives us
the widest range of support.
2023-02-01 11:48:37 -05:00
Luigi Teschio d6b3b26c01 Mini Cart block - added notice support (https://github.com/woocommerce/woocommerce-blocks/pull/7234)
* Mini Cart block - added notice support woocommerce/woocommerce-blocks#6941

Mini Cart block - added notice support

* set isDismissible to true

* address feedback

* improve layout

* fix style and update close button label

* fix UI when the admin bar is visible

* Split out dismissible notices

* fix css

Co-authored-by: Mike Jolley <mike.jolley@me.com>
2022-12-22 15:48:24 +01:00
Albert Juhé Lluveras 77b08b6ed3 Remove opinionated styles from Button component on TT3 and Zaino themes (https://github.com/woocommerce/woocommerce-blocks/pull/7992)
* Add Mini Cart button styles to Button component

* Add wp-element-button class to Button component

* Don't load opinionated button styles in TT3 and Zaino

* Remove bold styles from Mini Cart buttons
2022-12-20 16:02:12 +01:00
Luigi Teschio 87d527cf2c Fix Mini Cart Block global styles woocommerce/woocommerce-blocks#7379 (https://github.com/woocommerce/woocommerce-blocks/pull/7515)
* Fix Mini Cart Block global styles woocommerce/woocommerce-blocks#7379

Fix Mini Cart Block global styles

* add font_size
2022-10-31 11:47:01 +01:00
Tung Du 6c42a30674 Use theme's body background color as the mini cart contents default background color (https://github.com/woocommerce/woocommerce-blocks/pull/7510)
Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2022-10-28 22:30:51 +07:00
Tung Du c10e91e7e1 Fix: navigate through Mini Cart contents with keyboard (https://github.com/woocommerce/woocommerce-blocks/pull/6731)
Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2022-07-25 12:39:47 +07:00
Tung Du 1ba3ca2ba1 Fix: Mini Cart content scrolling issue (https://github.com/woocommerce/woocommerce-blocks/pull/6565) 2022-06-15 15:18:50 +07:00
Daniel Dudzic b15050909e Mini Cart: Add font size and font family controls (https://github.com/woocommerce/woocommerce-blocks/pull/6396)
* Mini Cart: Add font size and family controls

* Remove redundant property from the path

* Add conditional check for isFeaturePluginBuild
2022-05-30 10:45:15 +02:00
Tung Du 773db56bc5 Fix: Empty Mini Cart Contents view in editor is not vertically centered on WP 6.0 (https://github.com/woocommerce/woocommerce-blocks/pull/6379) 2022-05-06 18:05:54 +07:00
Alex Florisca e37b787e50 Move mini cart outside cart-checkout folder (https://github.com/woocommerce/woocommerce-blocks/pull/6192)
* Move shared folder to /blocks

* Moved mini-cart block in blocks dir:

* Rename shared folder to cart-checkout-shared

* Remove customDir from mini-cart webpack entry

* Update assets/js/base/context/tsconfig.json

Co-authored-by: Tung Du <dinhtungdu@gmail.com>

* Feedback changes

Co-authored-by: Tung Du <dinhtungdu@gmail.com>
2022-04-07 14:47:58 +01:00
Alex Florisca e15d516163 Revert "Move cart and mini-cart blocks into their own folders (https://github.com/woocommerce/woocommerce-blocks/pull/6126)" (https://github.com/woocommerce/woocommerce-blocks/pull/6190)
This reverts commit d005dbd2cf.
2022-04-05 11:14:32 +01:00
Alex Florisca d005dbd2cf Move cart and mini-cart blocks into their own folders (https://github.com/woocommerce/woocommerce-blocks/pull/6126)
* Move cart and mini-cart into their own folders

* Update other references of cart-checkout
2022-04-04 12:34:29 +01:00