<div class="col-12 col-md-6 mt-4 mt-lg-0">
    <div class="card h-100 mw-100 user-detail-box">
        <div class="card-header">
            <h4 class="mb-0">Darstellung</h4>
        </div>
        <div class="card-body">
            <div class="form-check mb-3 ml-3 d-flex align-items-center">
                <input class="form-check-input" type="checkbox" value="" id="training_gridview"
                    name="{{settings.training_gridview}}" {% if 1==settings.training_gridview %}checked{% endif %}>
                <label class="form-check-label ml-2" for="training_gridview">
                    Trainingsübersicht als Tabelle
                </label>
            </div>
            <div class="form-check mb-3 ml-3 d-flex align-items-center">
                <input class="form-check-input" type="checkbox" value="" id="lektion_gridview"
                    name="{{settings.lektion_gridview}}" {% if 1==settings.lektion_gridview %}checked{% endif %}>
                <label class="form-check-label ml-2" for="lektion_gridview">
                    Lektionen als Tabelle
                </label>
            </div>
            <div class="form-check mb-3 ml-3 d-flex align-items-center">
                <input class="form-check-input" type="checkbox" value="" id="gutenbergeditor"
                    name="{{settings.gutenbergeditor}}" {% if 1==settings.gutenbergeditor %}checked{% endif %}>
                <label class="form-check-label ml-2" for="gutenbergeditor">
                    Gutenbergeditor anzeigen
                </label>
            </div>
            <div class="form-check mb-3 ml-3 d-flex align-items-center">
                <input class="form-check-input" type="checkbox" value="" id="disablecommentblocking"
                    name="{{settings.disablecommentblocking}}" {% if 1==settings.disablecommentblocking %}checked{%
                    endif %}>
                <label class="form-check-label ml-2" for="disablecommentblocking">
                    Kommentar-Funktion <b>nicht</b> blockieren
                </label>
            </div>
            <div class="form-check mb-2 ml-3 d-flex align-items-center">
                <input class="form-check-input" type="checkbox" value="" id="enablevisualeditor"
                    name="{{settings.enablevisualeditor}}" {% if 1==settings.enablevisualeditor %}checked{% endif %}>
                <label class="form-check-label ml-2" for="enablevisualeditor">
                    Visuellen Editor aktivieren (für Trainings, Lektionen, Seiten, Übungen, etc.)
                </label>
            </div>
            <div class="form-check mb-3 ml-3 d-flex align-items-center">
                <span class="text-danger ml-2">Durch Nutzen des visuellen Editors kann es zu Fehlern beim Speichern
                    kommen.</span>
            </div>
            <div class="input-group mb-3">
                <label for="avatar_overlay_view_select" class="col-sm-6 col-form-label pt-0">Avatar Overflow
                    anzeigen:</label>
                <div class="col-sm-6">
                    <select size="1" class="form-control" id="avatar_overlay_view_select">
                        {% for key, list in lists %}
                        <option data-key="avatar_overlay_view" value="{{ list }}" {% if
                            (list)==settings.avatar_overlay_view %}selected{% endif %}>{{ key }}</option>
                        {% endfor %}
                    </select>
                </div>
            </div>
            <div class="input-group mb-3">
                <label for="lektionen_text" class="col-sm-6 col-form-label py-0 my-auto">Bezeichnung für "Lektionen":</label>
                <div class="col-sm-6">
                    <input class="form-control" type="text" id="lektionen_text" value="{{ settings.lektionen_text }}" placeholder="Lektionen"></input>
                </div>
            </div>
        </div>
    </div>
</div>