Radiobutton
CODE
×
HTML
<div class='form-check mb-3'> <input type=radio value='' class='form-check-input' name='flexRadio-1' id='flexRadio-1'> <label class='form-check-label' for='flexRadio-1'>Name of form element</label> </div>
CSS
label.form-check-label { font-family: var(--body-font-1); font-style: var(--body-font-2); font-weight: var(--body-font-3); font-size: var(--fs-xs); line-height: var(--lh-s); color: var(--fc2); margin-left: 10px; } input[type=radio].form-check-input { border-color: var(--lc5); margin-top: 0px; width: 26px; height: 26px; } input[type=radio].form-check-inputdisabled { background-color: var(--bc5); opacity:1; } .form-check-input:focus[type=radio] { box-shadow: none; } .form-check-input:focus-visible[type=radio] { border-color: var(--lsc1); box-shadow: 0 0 0 0.15rem var(--bsc1); } .form-check-input[disabled] ~ .form-check-label, .form-check-input:disabled ~ .form-check-label { color: var(--fdc); opacity: 1; } .form-check-input:checked[type=radio] { background-color: var(--bsc2); border-color: var(--lsc2); } .form-check-input:checked[type=radio][disabled], .form-check-input:checked:disabled[type=radio] { border-color: var(--ldc); } label { font-family: var(--body-font-1); font-style: var(--body-font-2); font-weight: var(--body-font-3); font-size: var(--fs-s); line-height: var(--lh-s); color: var(--fc2); }
JS
Radiobutton
Last Edit: Aug 18, 2023, 8:58am
×
Name of form element