goffeetabler/liquid/includes/cards/credit-card.html
2026-05-01 12:46:11 -05:00

47 lines
No EOL
1.2 KiB
HTML

<div class="card">
<div class="card-body">
<div class="mb-3">
<div class="form-label">Card number</div>
{% include "ui/form/input-mask.html" mask="0000 0000 0000 0000" visible=true %}
</div>
<div class="mb-3">
<div class="form-label">Card name</div>
<input type="text" class="form-control">
</div>
<div class="row">
<div class="col-8">
<div class="mb-3">
<label class="form-label">Expiration date</label>
<div class="row g-2">
<div class="col">
<select class="form-select">
{% for month in (1..12) %}
<option value="{{ month }}">{{ month }}</option>
{% endfor %}
</select>
</div>
<div class="col">
<select class="form-select">
{% for year in (2020..2030) %}
<option value="{{ year }}">{{ year }}</option>
{% endfor %}
</select>
</div>
</div>
</div>
</div>
<div class="col">
<div class="mb-3">
<div class="form-label">CVV</div>
<input type="number" class="form-control">
</div>
</div>
</div>
<div class="mt-2">
{% include "ui/button.html" text="Pay now" color="primary" block=true %}
</div>
</div>
</div>