2025-03-08 10:51:57 -06:00

74 lines
1.7 KiB
HTML

<head>
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
<script
src="https://secure.reverepayments.com/token/CollectCheckout.js"
data-checkout-key="checkout_public_NnrZVw4gfk6B2j68MQ6u4q86PDJtH2Fn"
></script>
<style>
.container {
width: 380px;
padding: 20px 0 30px 0;
margin-top: 20px;
border-radius: 8px;
box-shadow: 0 3px 20px rgba(0, 0, 0, 0.2);
}
h1 {
text-align: center;
font-size: 24px;
}
#redirectLink {
width: 180px;
display: flex;
align-items: center;
justify-content: center;
color: white;
border-radius: 4px;
margin: 20px auto 0 auto;
height: 40px !important;
font-size: 20px;
background-color: #37805b;
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
transition: 200ms;
}
#redirectLink:hover {
background-color: #19c687;
box-shadow: 0 3px 4px rgba(0, 0, 0, 0.2);
cursor: pointer;
transition: 200ms;
}
</style>
<body>
<div class="container">
<h1>Run a Test Transaction</h1>
<div id="redirectLink">Start</div>
</div>
<script>
document
.getElementById("redirectLink")
.addEventListener("click", function (e) {
CollectCheckout.redirectToCheckout({
lineItems: [
{
sku: "test-02",
quantity: 1,
},
],
// successUrl: "https://shilohcode.com",
// cancelUrl: "https://paymenter.lasthourhosting.org/checkout",
// key: "checkout_public_NnrZVw4gfk6B2j68MQ6u4q86PDJtH2Fn",
receipt: { showReceipt: true },
}).then((error) => {
console.log(error);
});
});
</script>
</body>