Forms
Markup for HTML forms
<form>
<label for="text" class="form-label">Textbox</label>
<div class="help-block">Help text block</div>
<input type="text" id="text" placeholder="Placeholder text...">
</form>
<form>
<label for="text" class="form-label">Error <span class="error-color">*</span></label>
<input type="text" id="text" required>
<div class="field-validation-error">Error text</div>
</form>
<form>
<label for="text" class="form-label">Validated <span class="error-color">*</span></label>
<div class="form-validate-wrap">
<input type="text" id="text" required value="Validated">
<i class="fa fa-check-circle" aria-hidden="true"></i>
</div>
</form>
<label class="cb-wrap">
<input type="checkbox"> Checkbox
<span class="checkmark"></span>
</label>
<label class="rb-wrap">
<input type="radio" name="radio"> Radio 1
<span class="radiobtn"></span>
</label>
<div class="text-center">
<svg class="checkmark-svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52 52">
<circle class="checkmark__circle" cx="26" cy="26" r="25" fill="none" />
<path class="checkmark__check" fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8" />
</svg>
<h4 class="success-color">Oh yhea, you did it!</h4>
</div>
Last modified 2yr ago