base tabler
This commit is contained in:
parent
ac2cfa9fe1
commit
0f84beacf1
1432 changed files with 28760 additions and 1 deletions
73
liquid/includes/forms/form-elements-2.html
Normal file
73
liquid/includes/forms/form-elements-2.html
Normal file
|
|
@ -0,0 +1,73 @@
|
|||
<div class="mb-3">
|
||||
<label class="form-label">Form control rounded</label>
|
||||
<input type="text" class="form-control form-control-rounded mb-2" name="Form control rounded" placeholder="Text..">
|
||||
{% include "ui/form/input-icon.html" input-class="form-control-rounded" %}
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Form control flush</label>
|
||||
<input type="text" class="form-control form-control-flush" name="Form control flush" placeholder="Text..">
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Input group</label>
|
||||
{% include "ui/form/input-group.html" prepend="@" placeholder="username" class="mb-2" %}
|
||||
{% include "ui/form/input-group.html" append=".tabler.io" placeholder="subdomain" class="mb-2" %}
|
||||
{% include "ui/form/input-group.html" prepend="https://" append=".tabler.io" placeholder="subdomain" %}
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Input with checkbox or radios</label>
|
||||
{% include "ui/form/input-group.html" prepend="checkbox" class="mb-2" %}
|
||||
{% include "ui/form/input-group.html" append="radio" %}
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Input with prepended text</label>
|
||||
{% include "ui/form/input-group.html" prepend="https://tabler.io/users/" flat=true input-class="ps-0" value="yourfancyusername" %}
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Input with appended text</label>
|
||||
{% include "ui/form/input-group.html" append=".tabler.io" input-class="text-end pe-0" flat=true value="yourfancydomain" %}
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Input with appended link</label>
|
||||
{% include "ui/form/input-group.html" append-link="Show password" flat=true type="password" value="ultrastrongpassword" %}
|
||||
</div>
|
||||
|
||||
{% capture html -%}
|
||||
<kbd>ctrl + K</kbd>
|
||||
{%- endcapture %}
|
||||
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Input with appended kbd</label>
|
||||
{% include "ui/form/input-group.html" append-html=html flat=true %}
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Input with appended icon links</label>
|
||||
{% include "ui/form/input-group.html" append-button="x:Clear search,adjustments:Search settings,bell:Add notification" flat=true %}
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Floating inputs</label>
|
||||
<div class="form-floating mb-3">
|
||||
<input type="email" class="form-control" id="floating-input" value="name@example.com" autocomplete="off">
|
||||
<label for="floating-input">Email address</label>
|
||||
</div>
|
||||
<div class="form-floating mb-3">
|
||||
<input type="password" class="form-control" id="floating-password" value="Password" autocomplete="off">
|
||||
<label for="floating-password">Password</label>
|
||||
</div>
|
||||
<div class="form-floating">
|
||||
<select class="form-select" id="floatingSelect" aria-label="Floating label select example">
|
||||
<option selected>Open this select menu</option>
|
||||
<option value="1">One</option>
|
||||
<option value="2">Two</option>
|
||||
<option value="3">Three</option>
|
||||
</select>
|
||||
<label for="floatingSelect">Select</label>
|
||||
</div>
|
||||
</div>
|
||||
Loading…
Add table
Add a link
Reference in a new issue