<div class="form-group styles-{{- name }}">
    <label class="form-label" for="{{- name }}">{{- label }}</label>
    <input type="text" id="{{- name }}" class="form-control data-list" name="{{- name }}" value="{{- value }}" placeholder="{{- placeholder }}" list="{{- name }}-data-list">
    <datalist id="{{- name }}-data-list">
        <option value="inherit">inherit</option>
        <option value="initial">initial</option>
        <option value="8px">8px</option>
        <option value="9px">9px</option>
        <option value="10px">10px</option>
        <option value="11px">11px</option>
        <option value="12px">12px</option>
        <option value="13px">13px</option>
        <option value="14px">14px</option>
        <option value="15px">15px</option>
        <option value="16px">16px</option>
        <option value="17px">17px</option>
        <option value="18px">18px</option>
        <option value="19px">19px</option>
        <option value="20px">20px</option>
        <option value="21px">21px</option>
        <option value="22px">22px</option>
        <option value="23px">23px</option>
        <option value="24px">24px</option>
        <option value="25px">25px</option>
        <option value="30px">30px</option>
        <option value="35px">35px</option>
        <option value="40px">40px</option>
        <option value="45px">45px</option>
        <option value="50px">50px</option>
        <option value="75px">75px</option>
        <option value="100px">100px</option>
    </datalist>
</div>