Order confirmation: Update mobile order summary styling so items appear side by side (#50722)
* Update order confirmation wording * Style order details inline * Changelog * Update test due to change of text
This commit is contained in:
parent
d773bb483a
commit
6c4a26770d
|
@ -26,7 +26,14 @@
|
|||
}
|
||||
|
||||
@media only screen and (max-width: 480px) {
|
||||
flex-direction: column;
|
||||
li {
|
||||
width: 100%;
|
||||
|
||||
> .wc-block-order-confirmation-summary-list-item__key,
|
||||
> .wc-block-order-confirmation-summary-list-item__value {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.woocommerce-verify-email {
|
||||
|
|
|
@ -0,0 +1,4 @@
|
|||
Significance: minor
|
||||
Type: tweak
|
||||
|
||||
On mobile, style order confirmation page details side by side
|
|
@ -29,11 +29,11 @@ class Summary extends AbstractOrderConfirmationBlock {
|
|||
}
|
||||
|
||||
$content = '<ul class="wc-block-order-confirmation-summary-list">';
|
||||
$content .= $this->render_summary_row( __( 'Order number:', 'woocommerce' ), $order->get_order_number() );
|
||||
$content .= $this->render_summary_row( __( 'Order #:', 'woocommerce' ), $order->get_order_number() );
|
||||
$content .= $this->render_summary_row( __( 'Date:', 'woocommerce' ), wc_format_datetime( $order->get_date_created() ) );
|
||||
$content .= $this->render_summary_row( __( 'Total:', 'woocommerce' ), $order->get_formatted_order_total() );
|
||||
$content .= $this->render_summary_row( __( 'Email:', 'woocommerce' ), $order->get_billing_email() );
|
||||
$content .= $this->render_summary_row( __( 'Payment method:', 'woocommerce' ), $order->get_payment_method_title() );
|
||||
$content .= $this->render_summary_row( __( 'Payment:', 'woocommerce' ), $order->get_payment_method_title() );
|
||||
$content .= '</ul>';
|
||||
|
||||
return $content;
|
||||
|
|
|
@ -114,7 +114,7 @@ test.describe(
|
|||
page.getByText( 'Your order has been received' )
|
||||
).toBeVisible();
|
||||
await expect(
|
||||
page.getByText( `Order number: ${ orderId }` )
|
||||
page.getByText( `Order #: ${ orderId }` )
|
||||
).toBeVisible();
|
||||
await expect(
|
||||
await page.getByText( `Total: $${ productPrice }` ).count()
|
||||
|
|
Loading…
Reference in New Issue