<div class="tab {{tab.cssClass}}" data-tab="preferences" data-group="dsn-main">
    <div class="settings-list">
        <div class="form-group">
            <label>{{localize "DICESONICE.onlyShowMyDice"}}</label>
            <input type="checkbox" data-onlyShowOwnDice name="onlyShowOwnDice" data-dtype="Boolean" {{checked onlyShowOwnDice}} />
        </div>

        <div class="form-group">
            <label>{{localize "DICESONICE.hideAfterRoll"}}</label>
            <input type="checkbox" data-hideAfterRoll name="hideAfterRoll" data-dtype="Boolean" {{checked hideAfterRoll}} />
        </div>

        <div class="form-group setting-timeBeforeHide">
            <label>{{localize "DICESONICE.timeBeforeHide"}}</label>
            <input type="text" data-timeBeforeHide name="timeBeforeHide" value="{{timeBeforeHide}}">
        </div>

        <div class="form-group">
            <label>{{localize "DICESONICE.hideFX"}}</label>
            <select data-hideFX name="hideFX">
                {{selectOptions fxList selected=hideFX}}
            </select>
        </div>

        <div class="form-group">
            <label>{{localize "DICESONICE.sounds"}}</label>
            <input type="checkbox" data-sounds name="sounds" data-dtype="Boolean" {{checked sounds}} />
        </div>

        <div class="form-group">
            <label>{{localize "DICESONICE.muteSoundSecretRolls"}}</label>
            <input type="checkbox" data-muteSoundSecretRolls name="muteSoundSecretRolls" data-dtype="Boolean" {{checked muteSoundSecretRolls}} />
        </div>

        <div class="form-group">
            <label>{{localize "DICESONICE.soundsVolume"}}</label>
            <div class="form-fields">
                <input type="range" data-soundsVolume name="soundsVolume" value="{{soundsVolume}}" min="0.1" max="1" step="0.1" data-dtype="Number">
                <span class="range-value">{{soundsVolume}}</span>
            </div>
        </div>

        <div class="form-group">
            <label>{{localize "DICESONICE.soundsSurface"}}</label>
            <select data-soundsSurface name="soundsSurface">
                {{selectOptions soundsSurfaceList selected=soundsSurface}}
            </select>
        </div>

        <div class="form-group">
            <label>{{localize "DICESONICE.autoSize"}}</label>
            <input type="checkbox" data-autoscale name="autoscale" data-dtype="Boolean" {{checked autoscale}} />
        </div>

        <div class="form-group">
            <label>{{localize "DICESONICE.size"}}</label>
            <div class="form-fields">
                <input type="range" data-scale name="scale" value="{{scale}}" min="20" max="100" step="1" data-dtype="Number">
                <span class="range-value">{{scale}}</span>
            </div>
        </div>

        <div class="form-group">
            <label>{{localize "DICESONICE.speed"}}</label>
            <select data-speed name="speed">
                {{selectOptions speedList selected=speed}}
            </select>
        </div>

        <div class="form-group">
            <label>{{localize "DICESONICE.canvasZIndex"}}</label>
            <select data-canvasZIndex name="canvasZIndex">
                {{selectOptions canvasZIndexList selected=canvasZIndex}}
            </select>
        </div>

        <div class="form-group">
            <label>{{localize "DICESONICE.throwingForce"}}</label>
            <select data-throwingForce name="throwingForce">
                {{selectOptions throwingForceList selected=throwingForce}}
            </select>
        </div>

        <div class="form-group">
            <label>{{localize "DICESONICE.enableFlavorColorset"}}</label>
            <input type="checkbox" data-enableFlavorColorset name="enableFlavorColorset" data-dtype="Boolean" {{checked enableFlavorColorset}} />
        </div>

        <div class="form-group">
            <label>{{localize "DICESONICE.immersiveDarkness"}}</label>
            <input type="checkbox" data-immersiveDarkness name="immersiveDarkness" data-dtype="Boolean" {{checked immersiveDarkness}} />
        </div>
    </div>
</div>