{% load cradmin_kss_styleguide_tags %}

{% if node.level != -1 %}
    {% render_kss_section styleguideconfig=styleguideconfig node=node %}
{% endif %}

{% for childnode in node.sorted_all_descendants_flat %}
    {% render_kss_section styleguideconfig=styleguideconfig node=childnode %}
{% endfor %}


<script>
    function cradmin_kss_styleguide_toggle_example(event, id, showcode) {
        var domElement = window.document.getElementById(id);
        var previewButtonElement = window.document.getElementById(id + '_previewbutton');
        var codeButtonElement = window.document.getElementById(id + '_codebutton');

        domElement.classList.remove('kss-usage__example--showpreview');
        domElement.classList.remove('kss-usage__example--showcode');
        previewButtonElement.classList.remove('button--fill');
        codeButtonElement.classList.remove('button--fill');

        if(showcode) {
            domElement.classList.add('kss-usage__example--showcode');
            codeButtonElement.classList.add('button--fill');
        } else {
            domElement.classList.add('kss-usage__example--showpreview');
            previewButtonElement.classList.add('button--fill');
        }

        event.target.blur();
    }

    function cradmin_kss_styleguide_autoresize_iframe(obj) {
        obj.style.height = '300px';
        obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
    }
</script>
