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.
2 changed files with 28 additions and 3 deletions
Showing only changes of commit 2be7eaf5d8 - Show all commits

View File

@ -1723,16 +1723,28 @@
<div class="form-check"> <div class="form-check">
<input class="form-check-input" id="example-radios-1" name="example-radios" type="radio" value="option-1" checked> <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"> <label class="form-check-label" for="example-radios-1">
Default radio Default radio 1
</label> </label>
</div> </div>
<div class="form-check"> <div class="form-check">
<input class="form-check-input" id="example-radios-2" name="example-radios" type="radio" value="option-2"> <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"> <label class="form-check-label" for="example-radios-2">
Second default radio Default radio 2
</label> </label>
</div> </div>
</div> </div>
<div class="col-md-6">
<label class="form-check-custom form-check-custom-radio">
Custom radio one
<input name="radio" type="radio" value="" checked>
<span class="form-check-custom-mark"></span>
</label>
<label class="form-check-custom form-check-custom-radio">
Custom radio two
<input name="radio" type="radio" value="">
<span class="form-check-custom-mark"></span>
</label>
</div>
</div> </div>
</fieldset> </fieldset>
</form> </form>

View File

@ -277,3 +277,16 @@ select
top: .4rem top: .4rem
transform: rotate(45deg) transform: rotate(45deg)
width: .6rem width: .6rem
.form-check-custom-radio
.form-check-custom-mark
border-radius: 50%
&:after
background: white
border: 0
border-radius: 50%
height: var(--spacer-2)
left: .6rem
top: .6rem
width: var(--spacer-2)