Change custom world clock custom liquid

I currently have a custom world clock timer on my spotlight page and I’ve managed to position it correctly although I am wondering if anyone can help me remove some parts of the clock/change its order.

It currently displays:

Although I want it to look like this:

Melbourne, Australia | Current date (e.g June 08, 2024) | current time (e.g 8:45 AM)

Is this possible?

see the current code below…

STORE URL: https://project-thirteen.com.au

PASS: projectthirteenpassword

Hello,

Play around with this line of code until your desired result.
x1 = x1 + " - " + hours + “:” + minutes + “:” + seconds + " " + ampm + " " + Intl.DateTimeFormat().resolvedOptions().timeZone;

Example: x1 = Intl.DateTimeFormat().resolvedOptions().timeZone + x1 + " - " + hours + “:” + minutes + “:” + seconds + " " + ampm
If you need help to do that, DM me.

Thanks @Taknify