57 lines
1.7 KiB
Plaintext
57 lines
1.7 KiB
Plaintext
|
|
||
|
|
% stash css => ["misc/xpay.css"];
|
||
|
|
% stash js => ["misc/stripe.js"];
|
||
|
|
<section class="header">
|
||
|
|
<h2 class="head"><%== $header %></h2>
|
||
|
|
</section>
|
||
|
|
<section class="title">
|
||
|
|
<article class="title">
|
||
|
|
<h2><%= $title %></h2>
|
||
|
|
<h1><%= $subtitle %></h1>
|
||
|
|
</article>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<section class="payment flex">
|
||
|
|
<div id="cover" hidden></div>
|
||
|
|
<article id="cinfo" class="cardinfo">
|
||
|
|
<div class="subtitle"><h1>Datos de la tarjeta</h1></div>
|
||
|
|
<div id="details">
|
||
|
|
<label>Nombre del titular </label>
|
||
|
|
<input id="cardholder-name" type="text" placeholder="Cardholder name">
|
||
|
|
<!-- placeholder for Elements -->
|
||
|
|
<label>Numero de tarjeta </label>
|
||
|
|
<div id="card-element"></div>
|
||
|
|
<button id="card-button">Siguiente</button>
|
||
|
|
</div>
|
||
|
|
</article>
|
||
|
|
<!-- opciones de plan -->
|
||
|
|
<article id="cplan" class="plan" hidden>
|
||
|
|
<div class="subtitle"><h1>Planes de pago</h1></div>
|
||
|
|
<div id="plans" >
|
||
|
|
<form id="installment-plan-form" >
|
||
|
|
<label>
|
||
|
|
<input id="immediate-plan" type="radio" name="installment_plan" value="-1" />
|
||
|
|
Un solo pago
|
||
|
|
</label>
|
||
|
|
<input id="payment-intent-id" type="hidden" />
|
||
|
|
</form>
|
||
|
|
<button id="confirm-button">Confirmar Pago</button>
|
||
|
|
</div>
|
||
|
|
</article>
|
||
|
|
<article id="cmsg" class="message" hidden>
|
||
|
|
<div id="result">
|
||
|
|
<p id="status-message"></p>
|
||
|
|
</div>
|
||
|
|
<div id="ccontact" hidden>
|
||
|
|
<form id="fcontact">
|
||
|
|
<label for="cname">Nombre</label>
|
||
|
|
<input type="text" name="cname"></input>
|
||
|
|
<label for="cmail">Correo</label>
|
||
|
|
<input type="email" name="cmail"></input>
|
||
|
|
<label for="ccomment">Comentarios</label>
|
||
|
|
<input type="text" name="ccomment"></input>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
<article>
|
||
|
|
</section>
|