jacs/goffeetabler
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

base tabler

Browse source
This commit is contained in:
JACS 2026-05-01 12:46:11 -05:00
parent ac2cfa9fe1
commit 0f84beacf1
1432 changed files with 28760 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

74
liquid/includes/cards/form/layout.html Normal file
View file

@ -0,0 +1,74 @@
{% assign horizontal = include.horizontal | default: false %}
<form class="card h-100">
<div class="card-header">
<h3 class="card-title">{{ include.title | default: 'Basic form' }}</h3>
</div>
<div class="card-body">
<div class="mb-3{% if horizontal %} row{% endif %}">
<label class="{% if horizontal %}col-3 col-form-label{% else %}form-label{% endif %} required">Email address</label>
<div{% if horizontal %} class="col"{% endif %}>
<input type="email" class="form-control" aria-describedby="emailHelp" placeholder="Enter email">
<small class="form-hint">We'll never share your email with anyone else.</small>
</div>
</div>
<div class="mb-3{% if horizontal %} row{% endif %}">
<label class="{% if horizontal %}col-3 col-form-label{% else %}form-label{% endif %} required">Password</label>
<div{% if horizontal %} class="col"{% endif %}>
<input type="password" class="form-control" placeholder="Password">
<small class="form-hint">
Your password must be 8-20 characters long, contain letters and numbers, and must not contain
spaces, special characters, or emoji.
</small>
</div>
</div>
<div class="mb-3{% if horizontal %} row{% endif %}">
<label class="{% if horizontal %}col-3 col-form-label{% else %}form-label{% endif %}">Select</label>
<div{% if horizontal %} class="col"{% endif %}>
<select class="form-select">
<option>Option 1</option>
<optgroup label="Optgroup 1">
<option>Option 1</option>
<option>Option 2</option>
</optgroup>
<option>Option 2</option>
<optgroup label="Optgroup 2">
<option>Option 1</option>
<option>Option 2</option>
</optgroup>
<optgroup label="Optgroup 3">
<option>Option 1</option>
<option>Option 2</option>
</optgroup>
<option>Option 3</option>
<option>Option 4</option>
</select>
</div>
</div>
<div class="{% if horizontal %}row{% else %}mb-3{% endif %}">
<label class="{% if horizontal %}col-3 col-form-label pt-0{% else %}form-label{% endif %}">Checkboxes</label>
<div{% if horizontal %} class="col"{% endif %}>
<label class="form-check">
<input class="form-check-input" type="checkbox" checked>
<span class="form-check-label">Option 1</span>
</label>
<label class="form-check">
<input class="form-check-input" type="checkbox">
<span class="form-check-label">Option 2</span>
</label>
<label class="form-check">
<input class="form-check-input" type="checkbox" disabled>
<span class="form-check-label">Option 3</span>
</label>
</div>
</div>
</div>
<div class="card-footer">
<div class="text-end">
<button type="submit" class="btn btn-primary">Submit</button>
</div>
</div>
</form>

91
liquid/includes/cards/form/payment.html Normal file
View file

@ -0,0 +1,91 @@
<form class="card">
<div class="card-body">
<h3 class="card-title">Payment Method</h3>
<p class="card-subtitle mb-4">All transactions are secure and encrypted</p>
<div class="mb-3">
<label class="form-label">Name on Card</label>
<input type="text" class="form-control" placeholder="John Doe">
</div>
<div class="row">
<div class="col-8">
<div class="mb-3">
<label class="form-label">Card Number</label>
<input type="text" class="form-control" placeholder="1234 5678 9012 3456">
<small class="form-hint">Enter your 16-digit number.</small>
</div>
</div>
<div class="col-4">
<div class="mb-3">
<label class="form-label">CVV</label>
<input type="text" class="form-control" placeholder="123">
</div>
</div>
</div>
<div class="row">
<div class="col-6">
<div class="mb-3">
<label class="form-label">Month</label>
<select class="form-select">
<option value="">MM</option>
<option value="1">January</option>
<option value="2">February</option>
<option value="3">March</option>
<option value="4">April</option>
<option value="5">May</option>
<option value="6">June</option>
<option value="7">July</option>
<option value="8">August</option>
<option value="9">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select>
</div>
</div>
<div class="col-6">
<div class="mb-3">
<label class="form-label">Year</label>
<select class="form-select">
<option value="">YYYY</option>
<option value="2025">2025</option>
<option value="2026">2026</option>
<option value="2027">2027</option>
<option value="2028">2028</option>
<option value="2029">2029</option>
<option value="2030">2030</option>
</select>
</div>
</div>
</div>
<hr class="my-4" />
<h3 class="card-title">Billing Address</h3>
<p class="card-subtitle mb-4">The billing address associated with your payment method</p>
<div class="mb-3">
<label class="form-check">
<input class="form-check-input" type="checkbox" checked>
<span class="form-check-label">Same as shipping address</span>
</label>
</div>
<hr class="my-4" />
<div class="mb-3">
<label class="form-label">Comments</label>
<textarea class="form-control" rows="3" placeholder="Add any additional comments"></textarea>
</div>
<div class="mt-4">
<div class="btn-list">
{% include "ui/button.html" text="Submit" color="primary" %}
{% include "ui/button.html" text="Cancel" %}
</div>
</div>
</div>
</form>