WAIT: Woocommerce Thank You Page Template CSS issues

Bricks Version: 1.6.2 and 1.7 (Beta)
Browser: Chrome 109, Firefox 110
OS: macOS / Windows / Linux / etc.
URL: (a link to a page that illustrates the issue would be really helpful)

Thank You Page Template > Order Overview css has issues. The Order Overview section ( that contains Order id, customer email, Purchase date and Payment method) is targeted by this css class <ul class="woocommerce-order-overview woocommerce-thankyou-order-details order_details">.

The issue is class .woocommerce-thankyou-order-details doesn’t exist in the stylesheet and .woocommerce-order-overview.order_details has a display: flex property, but in the browser, it is displaying as display: grid.

If I create a Thank You page template and target the element with a custom css in Bricks Builder with this CSS from the style sheet:

.woocommerce-order-overview.order_details {
    border-style: solid;
    border-width: 1px;
    display: flex;
    justify-content: center;
    margin: 0 0 15px;
    text-align: center;
}

then display: flex works.

Thanks & Regards

Hi,
Thanks so much for your report!

Unfortunately, I cannot reproduce the issue. However, right now is a tricky moment, as WooCommerce 7.4 has required the adaptation of some templates. Accordingly:

  • If you are using WooCommerce <= 7.3, please use Bricks 1.6.2 or smaller
  • If you are using WooCommerce 7.4, please test it with Bricks 1.7 beta

If the problem persists, a live link or screencast would be great so I can see and understand the problem.

Best regards,
timmse

@timmse When you tried it with Thank You Page, What is the CSS showing in the developer tools of browser for the Order Overview section? Does it not show display:grid?

Somebody else in the Facebook group also reported the same issue.

Please show me the problem with screenshots, a screencast, or a link, and tell me which WooCommerce version you are using. This is the information that is important at the moment and ensures that we are not talking past each other :v: