{% extends 'tb_base.html' %}
{% load static %}
{% load i18n %}
{% block CONTENT %}
    {% include "blocks/b_sections_buttons.html" %}

    <div class="breadcrumbs_documentation_block">
        <div class="cut-width">
            <div class="breadcrumbs_documentation">
{#                <div class="way_bread_crumb">#}
{#                    Документация и техническая поддержка#}
{#                </div>#}
{#                <picture class="breadcrumb_arrow_picture">#}
{#                    <source srcset="{% static "images/breadcrumb_arrow.svg" %}">#}
{#                    <img class="breadcrumb_arrow_img" src="{% static "images/breadcrumb_arrow.svg" %}" alt="">#}
{#                </picture>#}
{#                <div class="way_bread_crumb">#}
{#                    Документация для версии 1#}
{#                </div>#}
{#                <picture class="breadcrumb_arrow_picture">#}
{#                    <source srcset="{% static "images/breadcrumb_arrow.svg" %}">#}
{#                    <img class="breadcrumb_arrow_img" src="{% static "images/breadcrumb_arrow.svg" %}" alt="">#}
{#                </picture>#}
{#                <div class="way_bread_crumb last">#}
{#                    Документация для версии 1#}
{#                </div>#}
                {% for name,url in breadcrumbs.items %}
                    <a class="way_bread_crumb{% if forloop.last %} last{% endif %}" {% if not forloop.last %}href="{{ url }}"{% endif %}>
                        {{ name }}
                    </a>
                    {% if not forloop.last %}
                    	<picture class="breadcrumb_arrow_picture">
                            <source srcset="{% static "images/breadcrumb_arrow.svg" %}">
                            <img class="breadcrumb_arrow_img" src="{% static "images/breadcrumb_arrow.svg" %}" alt="">
                        </picture>
                    {% endif %}
                {% endfor %}

            </div>
        </div>
    </div>
    <div class="documentation_block">
        <div class="cut-width flex_container_tree_and_content">
            <div class="left_curtain_documentation">
                <div class="documentation_version">
                    <div class="documentation_version_txt">
                        {% trans "Документация для версии" %}
                    </div>
                    <div class="documentation_version_switcher">
                        <div class="first_line_documentation_version_switcher" onclick="openVersionSwitcher(this)">
                            <div class="cur_documentation_version">
                                {{ cur_version.name }}
                            </div>
                            <picture class="documentation_switcher_arrow_picture">
                                <source srcset="{% static "images/arrow_for_documentation_switcher.svg" %}">
                                <img class="documentation_switcher_arrow_img" src="{% static "images/arrow_for_documentation_switcher.svg" %}" alt="">
                            </picture>
                        </div>
                        <div class="documentation_switcher_content_part hidden">
                            {% for item in allow_versions %}

                                <a class="one_item_documentation_switcher_content_part" href="{% url 'docs_version_page' item.url %}" data-title="{{ item.name }}">
                                    {{ item.name }}
                                </a>

                            {% endfor %}
                        </div>
                    </div>
                </div>
                <div class="tree_documentation_container">
                    {% for id, obj in doc_tree.items %}
                    	<div class="tree_documentation_container_first_level">
                            <div class="tree_documentation_container_first_line">
                                {% if obj.children %}
                                	<picture class="tree_documentation_arrow_picture" onclick="showContentPartTree(this)" {% if obj.active %}style="rotate: 90deg;"{% endif %}>
                                        <source srcset="{% static "images/arrow_for_doc_tree.svg" %}">
                                        <img class="tree_documentation_arrow_img" src="{% static "images/arrow_for_doc_tree.svg" %}" alt="">
                                    </picture>
                                {% endif %}
                                <a class="tree_documentation_container_first_level_txt {% if not obj.children %}margin {% endif %}{% if cur_article.url == obj.url %}chose{% endif %}" href="{% url 'docs_art_page' cur_version.url obj.url %}">
                                    {{ obj.name }}
                                </a>
                            </div>
                            {% if obj.children %}
                                <div class="content_part_tree_documentation_container {% if not obj.active %}hidden{% endif %}">
                                    {% for id, obj in obj.children.items %}

                                        <div class="tree_documentation_container_second_level">
                                            <div class="tree_documentation_container_first_line">
                                                {% if obj.children %}
                                                    <picture class="tree_documentation_arrow_picture" onclick="showContentPartTree(this)" {% if obj.active %}style="rotate: 90deg;"{% endif %}>
                                                        <source srcset="{% static "images/arrow_for_doc_tree.svg" %}">
                                                        <img class="tree_documentation_arrow_img" src="{% static "images/arrow_for_doc_tree.svg" %}" alt="">
                                                    </picture>
                                                {% endif %}
                                                <a class="tree_documentation_container_second_level_txt {% if not obj.children %}margin {% endif %}{% if cur_article.url == obj.url %}chose{% endif %}" href="{% url 'docs_art_page' cur_version.url obj.url %}">
                                                    {{ obj.name }}
                                                </a>
                                            </div>
                                            {% if obj.children %}
                                                <div class="content_part_tree_documentation_container min_padding {% if not obj.active %}hidden{% endif %}">
                                                    <div class="elements_third_level_content_part_tree">
                                                    {% for id,obj in obj.children.items %}
                                                        <a class="element_third_level_content_part_tree {% if cur_article.url == obj.url %}chose{% endif %}" href="{% url 'docs_art_page' cur_version.url obj.url %}">
                                                            {{ obj.name }}
                                                        </a>
                                                    {% endfor %}
                                                    </div>
                                                </div>
                                            {% endif %}
                                        </div>

                                    {% endfor %}
                                </div>
                            {% endif %}
                        </div>
                    {% endfor %}
                </div>
            </div>
            {% include "blocks/b_documentation_article.html" %}
        </div>
    </div>
{% endblock %}