Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity
woocommerce/plugins/woocommerce-blocks/docs/theming/class-names-update-330.md

58 lines
2.1 KiB
Markdown
Raw Normal View History

Split Checkout block component into smaller files (https://github.com/woocommerce/woocommerce-blocks/pull/3062) * Rename CheckoutForm to Form * Create CheckoutForm component * Simplify directory structure * Add docs about class name changes * Add PropTypes to CheckoutForm * Update skeleton class name * Extract LoginPrompt * Move loginToCheckoutUrl to a constant * Move replaced class name docs to 3.4.0 specific file
2020-08-31 10:17:42 +00:00
# Class names update in 3.3.0
Show express payment methods in the Cart block (https://github.com/woocommerce/woocommerce-blocks/pull/3004) * Shown express payment methods in Cart block * Fixes * Create usePositionRelativeToViewport hook * Typo * Style fixes * Remove footer push div * Styling fixes * Improve code clarity * Split ExpressCheckoutFormControl into two components * Rename visibilityObserver to referenceElement * Replace 'useEffect' with 'useLayoutEffect' * Add tests for usePositionRelativeToViewport * Self-closing div * Add explanatory comment * Create a shim for IntersectionObserver * Update express payment components class names * Add todo comment to remove IntersectionObserver shim when we drop IE11 support
2020-08-20 14:14:12 +00:00
WC Blocks 3.3.0, introduced express payment methods in the Cart block. In order to make it easy to write styles for express payment methods for the Cart and Checkout blocks separately, we updated several class names:
## Replaced classes
<table>
<tr>
<th>Removed</th>
<th>New class</th>
</tr>
<tr>
<td rowspan="3"><code>wc-block-components-express-checkout</td>
<td><code>wc-block-components-express-payment</code> (generic)</td>
</tr>
<tr>
<td><code>wc-block-components-express-payment--checkout</code> (Checkout block)</td>
</tr>
<tr>
<td><code>wc-block-components-express-payment--cart</code> (Cart block)</td>
</tr>
<tr>
<td><code>wc-block-components-express-checkout__title-container</code></td>
<td><code>wc-block-components-express-payment__title-container</code></td>
</tr>
<tr>
<td><code>wc-block-components-express-checkout__title</code></td>
<td><code>wc-block-components-express-payment__title</code></td>
</tr>
<tr>
<td><code>wc-block-components-express-checkout__content</code></td>
<td><code>wc-block-components-express-payment__content</code></td>
</tr>
<tr>
<td rowspan="3"><code>wc-block-components-express-checkout-continue-rule</code></td>
<td><code>wc-block-components-express-payment-continue-rule</code> (generic)</td>
</tr>
<tr>
<td><code>wc-block-components-express-payment-continue-rule--checkout</code> (Checkout block)</td>
</tr>
<tr>
<td><code>wc-block-components-express-payment-continue-rule--cart</code> (Cart block)</td>
</tr>
<tr>
<td><code>wc-block-components-express-checkout-payment-event-buttons</code></td>
<td><code>wc-block-components-express-payment__event-buttons</code></td>
</tr>
</table>
Include issue submission link in the footer of all documention (.md files) (https://github.com/woocommerce/woocommerce-blocks/pull/5655) * Add links to single routes in main index woocommerce/woocommerce-blocks#4473 * Footer * Feedback template * Remove footer from existing MD files * Add doc footer script * Apply script to all docs * Fix examples
2022-02-02 14:27:46 +00:00
<!-- FEEDBACK -->
---
[We're hiring!](https://woocommerce.com/careers/) Come work with us!
🐞 Found a mistake, or have a suggestion? [Leave feedback about this document here.](https://github.com/woocommerce/woocommerce-gutenberg-products-block/issues/new?assignees=&labels=type%3A+documentation&template=--doc-feedback.md&title=Feedback%20on%20./docs/theming/class-names-update-330.md)
<!-- /FEEDBACK -->