Mirrors/tabler
1
0
Fork 0
mirror of https://github.com/tabler/tabler.git synced 2026-08-16 08:12:22 +04:00
Code Issues Projects Releases Wiki Activity

update form controls to newest bootstrap

Browse Source
This commit is contained in:
codecalm
2019-07-29 23:38:59 +02:00
parent 47ea9b24f8
commit 4f954f6996
21 changed files with 143 additions and 185 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/_includes/forms/form-elements-2.html
+1 -35
View File
@@ -28,7 +28,7 @@
</div>
<div class="mb-2">
<label class="form-label">Ratios</label>
<input type="range" class="custom-range" step="5" min="0" max="50">
<input type="range" class="form-range" step="5" min="0" max="50">
</div>
<div class="mb-2">
<label class="form-label">Size</label>
@@ -53,37 +53,3 @@
{% include ui/input-selectgroup.html values="HTML,CSS,PHP,JavaScript" class="selectgroup-pills" %}
</div>
{% include parts/input-toggle.html %}
<div class="mb-2">
<div class="form-label">Toggle switch single</div>
<label class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input">
<div class="custom-control-label">I agree with terms and conditions</div>
</label>
</div>
<div class="mb-2">
<div class="form-label">Radios</div>
<div class="custom-controls-stacked">
<label class="custom-control custom-radio">
<input type="radio" class="custom-control-input" name="example-radios" value="option1"
checked>
<div class="custom-control-label">Option 1</div>
</label>
<label class="custom-control custom-radio">
<input type="radio" class="custom-control-input" name="example-radios" value="option2">
<div class="custom-control-label">Option 2</div>
</label>
<label class="custom-control custom-radio">
<input type="radio" class="custom-control-input" name="example-radios" value="option3"
disabled>
<div class="custom-control-label">Option Disabled</div>
</label>
<label class="custom-control custom-radio">
<input type="radio" class="custom-control-input" name="example-radios2" value="option4"
disabled checked>
<div class="custom-control-label">Option Disabled Checked</div>
</label>
</div>
</div>
pages/_includes/forms/form-elements-3.html
+26 -52
View File
@@ -1,68 +1,42 @@
<div class="mb-2">
<div class="form-label">Radios</div>
<div>
{% include ui/form/check.html title="Option 1" type="radio" %}
{% include ui/form/check.html title="Option 2" type="radio" %}
{% include ui/form/check.html title="Option 3" type="radio" %}
</div>
</div>
<div class="mb-2">
<div class="form-label">Inline Radios</div>
<div class="custom-controls-stacked">
<label class="custom-control custom-radio custom-control-inline">
<input type="radio" class="custom-control-input" name="example-inline-radios"
value="option1" checked>
<span class="custom-control-label">Option 1</span>
</label>
<label class="custom-control custom-radio custom-control-inline">
<input type="radio" class="custom-control-input" name="example-inline-radios"
value="option2">
<span class="custom-control-label">Option 2</span>
</label>
<label class="custom-control custom-radio custom-control-inline">
<input type="radio" class="custom-control-input" name="example-inline-radios"
value="option3">
<span class="custom-control-label">Option 3</span>
</label>
<div>
{% include ui/form/check.html title="Option 1" type="radio" inline=true %}
{% include ui/form/check.html title="Option 2" type="radio" inline=true %}
{% include ui/form/check.html title="Option 3" type="radio" inline=true %}
</div>
</div>
<div class="mb-2">
<div class="form-label">Checkboxes</div>
<div class="custom-controls-stacked">
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" name="example-checkbox1" value="option1"
checked>
<span class="custom-control-label">Option 1</span>
</label>
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" name="example-checkbox2"
value="option2">
<span class="custom-control-label">Option 2</span>
</label>
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" name="example-checkbox3" value="option3"
disabled>
<span class="custom-control-label">Option Disabled</span>
</label>
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" name="example-checkbox4" value="option4"
checked disabled>
<span class="custom-control-label">Option Disabled Checked</span>
</label>
<div>
{% include ui/form/check.html type="checkbox" %}
{% include ui/form/check.html type="checkbox" disabled=true %}
{% include ui/form/check.html type="checkbox" checked=true %}
</div>
</div>
<div class="mb-2">
<div class="form-label">Inline Checkboxes</div>
<div>
<label class="custom-control custom-checkbox custom-control-inline">
<input type="checkbox" class="custom-control-input" name="example-inline-checkbox1"
value="option1" checked>
<span class="custom-control-label">Option 1</span>
</label>
<label class="custom-control custom-checkbox custom-control-inline">
<input type="checkbox" class="custom-control-input" name="example-inline-checkbox2"
value="option2">
<span class="custom-control-label">Option 2</span>
</label>
<label class="custom-control custom-checkbox custom-control-inline">
<input type="checkbox" class="custom-control-input" name="example-inline-checkbox3"
value="option3">
<span class="custom-control-label">Option 3</span>
</label>
{% include ui/form/check.html inline=true title="Option 1" type="checkbox" %}
{% include ui/form/check.html inline=true title="Option 2" type="checkbox" disabled=true %}
{% include ui/form/check.html inline=true title="Option 3" type="checkbox" checked=true %}
</div>
</div>
{% include parts/input-toggle.html %}
<div class="mb-2">
<div class="form-label">Toggle switch single</div>
{% include ui/form/check.html title="I agree with terms and conditions" switch=true %}
</div>
<div class="mb-2">
<div class="form-label">Bootstrap's Custom File Input</div>
<div class="custom-file">