WIP: Form components extensions and improvements #94707

Draft
Márton Lente wants to merge 12 commits from component-forms into v2

When changing the target branch, be careful to rebase the branch in your fork to match. See documentation.
Showing only changes of commit d85b976831 - Show all commits

View File

@ -1274,7 +1274,7 @@
<li>Item One</li>
<li>Item Two</li>
</ul>
<hr />
<hr>
<p>
Add <code>list-inline</code> for inline layout.
</p>
@ -1638,7 +1638,7 @@
</div>
</div>
<hr />
<hr>
<div class="row">
<div class="col-md-6">
@ -1671,7 +1671,7 @@
</div>
</div>
<hr />
<hr>
<div class="row">
<div class="col-md-6">
@ -1681,7 +1681,7 @@
<textarea class="form-control" placeholder="Default Text"></textarea>
</div>
<hr />
<hr>
<button class="btn btn-success width-half pull-right" type="submit">
<i class="i-send"></i> Send Stuff!
@ -1721,14 +1721,14 @@
<div class="row">
<div class="col-md-6">
<div class="form-check">
<input class="form-check-input" id="example-radios-1" name="example-radios" type="radio" value="option-1" checked>
<label class="form-check-label" for="example-radios-1">
<input class="form-check-input" id="radios-default-1" name="radios-default" type="radio" value="option-1" checked>
<label class="form-check-label" for="radios-default-1">
Default radio 1
</label>
</div>
<div class="form-check">
<input class="form-check-input" id="example-radios-2" name="example-radios" type="radio" value="option-2">
<label class="form-check-label" for="example-radios-2">
<input class="form-check-input" id="radios-default-2" name="radios-default" type="radio" value="option-2">
<label class="form-check-label" for="radios-default-2">
Default radio 2
</label>
</div>
@ -1754,14 +1754,20 @@
<hr>
<div class="row">
<div class="col-md-6">
<label class="toggle-bar">
<input type="checkbox">
<span class="slider"></span>
</label>
<label class="toggle-bar toggle-bar-sm">
<input type="checkbox">
<span class="slider"></span>
</label>
<div class="mb-3">
<label class="me-3">Toggle bar</label>
<label class="toggle-bar">
<input type="checkbox">
<span class="slider"></span>
</label>
</div>
<div>
<label class="me-3">Toggle bar small</label>
<label class="toggle-bar toggle-bar-sm">
<input type="checkbox">
<span class="slider"></span>
</label>
</div>
</div>
</div>
@ -1789,7 +1795,7 @@
</div>
<hr />
<hr>
</div> <!-- centered container for the page-->
</div> <!-- container-main -->