Checkout Form
A piece of Checkout, for two columns of your own: place Checkout Form and Checkout summary side by side. It reads the same variables as Checkout.
Props
| Prop | Type | Default | What it does |
|---|---|---|---|
| Screen to preview | choice: form, receipt, failed | form | This one block is two screens: WooCommerce renders the checkout before paying and the “thank you” receipt afterwards, on the same page. The canvas never has a paid order, so this is how the receipt gets looked at while you style it. It changes nothing on the site. |
| Colors → Card background | text | var(--fe-woo-surface, #ffffff) | |
| Colors → Borders | text | var(--fe-woo-border, #e8ebef) | |
| Colors → Place order button | text | var(--fe-woo-accent, #111d2e) | |
| Colors → Button text | text | var(--fe-woo-accent-color, #ffffff) | |
| Colors → Buttons on hover | text | var(--fe-woo-accent-hover, color-mix(in srgb, var(--fe-woo-checkout-accent, #111d2e) 85%, var(--fe-woo-checkout-accent-color, #ffffff))) | |
| Colors → Button text on hover | text | var(--fe-woo-accent-color-hover, var(--fe-woo-checkout-accent-color, #ffffff)) |