<ul class="rings">
    <li id="earth">
        <label class="earth">
            <i class="i_earth dice-picker rollable" data-ring="earth"></i>
            <strong>{{localizeRing 'earth'}}</strong>
            <input class="centered-input select-on-focus" type="number" name="data.rings.earth" value="{{data.data.rings.earth}}" data-dtype="Number" min="1" max="9" placeholder="0" {{^if data.editable_not_soft_locked}}disabled{{/if}}/>
        </label>
    </li>
    <li id="air">
        <label class="air">
            <i class="i_air dice-picker rollable" data-ring="air"></i>
            <strong>{{localizeRing 'air'}}</strong>
            <input class="centered-input select-on-focus" type="number" name="data.rings.air" value="{{data.data.rings.air}}" data-dtype="Number" min="1" max="9" placeholder="0" {{^if data.editable_not_soft_locked}}disabled{{/if}}/>
        </label>
    </li>
    <li  id="water">
        <label class="water">
            <i class="i_water dice-picker rollable" data-ring="water"></i>
            <strong>{{localizeRing 'water'}}</strong>
            <input class="centered-input select-on-focus" type="number" name="data.rings.water" value="{{data.data.rings.water}}" data-dtype="Number" min="1" max="9" placeholder="0" {{^if data.editable_not_soft_locked}}disabled{{/if}}/>
        </label>
    </li>
    <li id="fire">
        <label class="fire">
            <i class="i_fire dice-picker rollable" data-ring="fire"></i>
            <strong>{{localizeRing 'fire'}}</strong>
            <input class="centered-input select-on-focus" type="number" name="data.rings.fire" value="{{data.data.rings.fire}}" data-dtype="Number" min="1" max="9" placeholder="0" {{^if data.editable_not_soft_locked}}disabled{{/if}}/>
        </label>
    </li>
    <li id="void">
        <label class="void">
            <i class="i_void dice-picker rollable" data-ring="void"></i>
            <strong>{{localizeRing 'void'}}</strong>
            <input class="centered-input select-on-focus" type="number" name="data.rings.void" value="{{data.data.rings.void}}" data-dtype="Number" min="1" max="9" placeholder="0" {{^if data.editable_not_soft_locked}}disabled{{/if}}/>
        </label>
    </li>
</ul>