Skip to content

Commit 2525cc6

Browse files
committed
Examples with validation
1 parent 6e638fb commit 2525cc6

File tree

1 file changed

+100
-0
lines changed

1 file changed

+100
-0
lines changed

example/index.html

Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -647,6 +647,106 @@ <h2>input-group</h2>
647647
</div>
648648
</div>
649649

650+
<h2>validation</h2>
651+
652+
<div class="mb-3 floating-label">
653+
<input id="text-is-valid" class="form-control is-valid" placeholder=" " />
654+
<label for="text-is-valid">input text</label>
655+
<div class="valid-feedback">valid-feedback</div>
656+
</div>
657+
658+
<div class="mb-3">
659+
<div class="input-group">
660+
<span class="input-group-text">prepend</span>
661+
<div class="floating-label is-valid">
662+
<input
663+
id="input-group-prepend-is-valid"
664+
class="form-control is-valid"
665+
placeholder=" "
666+
/>
667+
<label for="input-group-prepend-is-valid">input-group prepend</label>
668+
</div>
669+
<div class="valid-feedback">valid-feedback</div>
670+
</div>
671+
</div>
672+
673+
<div class="mb-3">
674+
<div class="input-group floating-label is-valid">
675+
<input id="input-group-append-is-valid" class="form-control is-valid" placeholder=" " />
676+
<label for="input-group-append-is-valid">input-group append</label>
677+
<span class="input-group-text">append</span>
678+
</div>
679+
<div class="valid-feedback">valid-feedback</div>
680+
</div>
681+
682+
<div class="mb-3">
683+
<div class="input-group">
684+
<span class="input-group-text">prepend</span>
685+
<div class="floating-label is-valid">
686+
<input
687+
id="input-group-prepend-append-is-valid"
688+
class="form-control is-valid"
689+
placeholder=" "
690+
/>
691+
<label for="input-group-prepend-append-is-valid">input-group prepend append</label>
692+
</div>
693+
<span class="input-group-text">append</span>
694+
<div class="valid-feedback">valid-feedback</div>
695+
</div>
696+
</div>
697+
698+
<!-- -->
699+
700+
<div class="mb-3 floating-label">
701+
<input id="text-is-invalid" class="form-control is-invalid" placeholder=" " />
702+
<label for="text-is-invalid">input text</label>
703+
<div class="invalid-feedback">invalid-feedback</div>
704+
</div>
705+
706+
<div class="mb-3">
707+
<div class="input-group">
708+
<span class="input-group-text">prepend</span>
709+
<div class="floating-label is-invalid">
710+
<input
711+
id="input-group-prepend-is-invalid"
712+
class="form-control is-invalid"
713+
placeholder=" "
714+
/>
715+
<label for="input-group-prepend-is-invalid">input-group prepend</label>
716+
</div>
717+
<div class="invalid-feedback">invalid-feedback</div>
718+
</div>
719+
</div>
720+
721+
<div class="mb-3">
722+
<div class="input-group floating-label is-invalid">
723+
<input
724+
id="input-group-append-is-invalid"
725+
class="form-control is-invalid"
726+
placeholder=" "
727+
/>
728+
<label for="input-group-append-is-invalid">input-group append</label>
729+
<span class="input-group-text">append</span>
730+
</div>
731+
<div class="invalid-feedback">invalid-feedback</div>
732+
</div>
733+
734+
<div class="mb-3">
735+
<div class="input-group">
736+
<span class="input-group-text">prepend</span>
737+
<div class="floating-label is-invalid">
738+
<input
739+
id="input-group-prepend-append-is-invalid"
740+
class="form-control is-invalid"
741+
placeholder=" "
742+
/>
743+
<label for="input-group-prepend-append-is-invalid">input-group prepend append</label>
744+
</div>
745+
<span class="input-group-text">append</span>
746+
<div class="invalid-feedback">invalid-feedback</div>
747+
</div>
748+
</div>
749+
650750
<h2>RTL</h2>
651751

652752
<div dir="rtl">

0 commit comments

Comments
 (0)