1. Objective

To prevent a situation where Bill Payment barcode might be displayed at a website or an email client that is themed in a black background or in a dark theme.

2. Description of change

• Adding a white background to a barcode's parent div element.
• Also rearrange a div element (moving <div style="clear:both"></div> into <div class="omise-billpayment-tesco-barcode">...`.

Before:

<div class="omise-billpayment-tesco-barcode">
    <div>... bar code ...</div>
    <div>... bar code ...</div>
    <div>... bar code ...</div>
</div>
<div style="clear:both"></div>

After:

<div class="omise-billpayment-tesco-barcode" style="background-color: #ffffff;">
    <div>... bar code ...</div>
    <div>... bar code ...</div>
    <div>... bar code ...</div>
    <div style="clear:both"></div>
</div>

The reason is those barcode elements are set to float: left and without clearing its floating position properly, we can't set a white background to .omise-billpayment-tesco-barcode element.

3. Quality assurance

✏️ Details:

Just test setting content's background to be black or using dark color then purchase an item with Bill Payment payment method while you are still at the dark-color theme.
Then, using any free barcode scanner application (mobile) to test scan barcode if it worked.

I did test scan the above barcodes on both website and email. It works properly.

4. Impact of the change

Nothing

5. Priority of change

Normal

6. Additional Notes

Suggested by @jonrandy