<!-- HTML -->
<div>
<label class="form-label" for="password-input">Magic Password ✨ (Click Here)</label>
<input type="password" class="form-control" placeholder="Enter password" id="password-input" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}">
<div class="form-text">Use 8 or more characters with a mix of letters, numbers & symbols.</div>
<div class="password-box collapse bg-light-subtle border border-light mt-2 rounded">
<div class="p-3">
<h5 class="fs-sm mb-2">Password Recipe:</h5>
<p id="pass-length" class="invalid fs-xs mb-2">Minimum <b>8 characters</b></p>
<p id="pass-lower" class="invalid fs-xs mb-2">At <b>lowercase</b> letter (a-z)</p>
<p id="pass-upper" class="invalid fs-xs mb-2">At least <b>uppercase</b> letter (A-Z)</p>
<p id="pass-number" class="invalid fs-xs mb-0">A least <b>number</b> (0-9)</p>
</div>
</div>
</div>
<!-- Find Javascript in File: assets/js/pages/misc-pass-meter.js -->
Minimum 8 characters
At lowercase letter (a-z)
At least uppercase letter (A-Z)
A least number (0-9)
Easily configure layout, styles, and preferences for your admin interface.