tree
This commit is contained in:
@@ -1695,6 +1695,7 @@ body.n_scroll{
|
||||
border: 1px solid #CCCED1FF;
|
||||
border-radius: 2px;
|
||||
margin-left: 16px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.first_line_documentation_version_switcher{
|
||||
@@ -1706,6 +1707,11 @@ body.n_scroll{
|
||||
|
||||
.documentation_switcher_content_part{
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
bottom: -31px;
|
||||
border: 1px solid #CCCED1FF;
|
||||
border-top: 0;
|
||||
left: -1px;
|
||||
}
|
||||
|
||||
.documentation_switcher_content_part.hidden{
|
||||
@@ -1717,8 +1723,11 @@ body.n_scroll{
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #0C54A0FF;
|
||||
padding: 6px 26px;
|
||||
transition: 200ms;
|
||||
padding: 6px 10px 6px 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.one_item_documentation_switcher_content_part:hover{
|
||||
|
||||
@@ -511,13 +511,17 @@ function openVersionSwitcher(el){
|
||||
let $parent = el.closest(".documentation_version_switcher")
|
||||
let $content_part = $parent.querySelector(".documentation_switcher_content_part")
|
||||
let $arrow = $parent.querySelector(".documentation_switcher_arrow_picture")
|
||||
$content_part.classList.toggle("hidden")
|
||||
if ($arrow.style.rotate === '0deg' || $arrow.style.rotate === '') {
|
||||
$($arrow).animate({rotate: '180deg'},200)
|
||||
let height = $content_part.offsetHeight
|
||||
$content_part.style.bottom = '-' + height + "px"
|
||||
$parent.style.borderBottom = '1px solid #fff'
|
||||
} else {
|
||||
$($arrow).animate({rotate: '0deg'},200)
|
||||
$parent.style.borderBottom = '1px solid #CCCED1FF'
|
||||
}
|
||||
|
||||
$content_part.classList.toggle("hidden")
|
||||
$("body")[0].setAttribute("onclick",'closeVersionSwitcherOnBody()')
|
||||
}
|
||||
|
||||
@@ -526,7 +530,8 @@ function closeVersionSwitcherOnBody () {
|
||||
let $version_switcher_container_content = $(".documentation_switcher_content_part")
|
||||
let $arrow = document.querySelector(".documentation_switcher_arrow_picture")
|
||||
$version_switcher_container_content.addClass("hidden")
|
||||
$($arrow).animate({rotate: '0deg'},200)
|
||||
$(".documentation_version_switcher").css({borderBottom: '1px solid #CCCED1FF'})
|
||||
$($arrow).animate({rotate: '180deg'},200)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -599,3 +604,12 @@ $(window).scroll(function (){
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
function chooseVersionComplete (el) {
|
||||
let url = el.dataset['url']
|
||||
let title = el.dataset['title']
|
||||
let $parent = el.closest(".documentation_version")
|
||||
let $cur_selected = $parent.querySelector(".documentation_version_txt")
|
||||
$cur_selected.innerHTML = title
|
||||
window.location.href = window.location.origin + url
|
||||
}
|
||||
@@ -45,9 +45,13 @@
|
||||
</picture>
|
||||
</div>
|
||||
<div class="documentation_switcher_content_part hidden">
|
||||
<div class="one_item_documentation_switcher_content_part">
|
||||
2
|
||||
{% for item in allow_versions %}
|
||||
|
||||
<div class="one_item_documentation_switcher_content_part" data-url="{% url 'docs_version_page' item.url %}" data-title="{{ item.name }}" onclick="chooseVersionComplete(this)">
|
||||
{{ item.name }}
|
||||
</div>
|
||||
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -61,12 +65,12 @@
|
||||
<img class="tree_documentation_arrow_img" src="{% static "images/arrow_for_documentation_switcher.svg" %}" alt="">
|
||||
</picture>
|
||||
{% endif %}
|
||||
<div class="tree_documentation_container_first_level_txt {% if not obj.children %}margin{% endif %}" onclick="choseItemTreeDocumentation(this)" data-url="{% url 'docs_art_page' cur_version.url obj.url %}">
|
||||
<div class="tree_documentation_container_first_level_txt {% if not obj.children %}margin {% endif %}{% if cur_article.url == obj.url %}chose{% endif %}" onclick="choseItemTreeDocumentation(this)" data-url="{% url 'docs_art_page' cur_version.url obj.url %}">
|
||||
{{ name }}
|
||||
</div>
|
||||
</div>
|
||||
{% if obj.children %}
|
||||
<div class="content_part_tree_documentation_container hidden">
|
||||
<div class="content_part_tree_documentation_container {% if not obj.active %}hidden{% endif %}">
|
||||
{% for name, obj in obj.children.items %}
|
||||
|
||||
<div class="tree_documentation_container_second_level">
|
||||
@@ -77,7 +81,7 @@
|
||||
<img class="tree_documentation_arrow_img" src="{% static "images/arrow_for_documentation_switcher.svg" %}" alt="">
|
||||
</picture>
|
||||
{% endif %}
|
||||
<div class="tree_documentation_container_second_level_txt {% if not obj.children %}margin{% endif %}" data-url="{% url 'docs_art_page' cur_version.url obj.url %}" onclick="choseItemTreeDocumentation(this)">
|
||||
<div class="tree_documentation_container_second_level_txt {% if not obj.children %}margin {% endif %}{% if cur_article.url == obj.url %}chose{% endif %}" data-url="{% url 'docs_art_page' cur_version.url obj.url %}" onclick="choseItemTreeDocumentation(this)">
|
||||
{{ name }}
|
||||
</div>
|
||||
</div>
|
||||
@@ -85,16 +89,16 @@
|
||||
{% for name,obj in obj.children.items %}
|
||||
<div class="content_part_tree_documentation_container min_padding hidden">
|
||||
<div class="elements_third_level_content_part_tree">
|
||||
<div class="element_third_level_content_part_tree" onclick="choseItemTreeDocumentation(this)" data-url="{% url 'docs_art_page' cur_version.url obj.url %}">
|
||||
<div class="element_third_level_content_part_tree {% if cur_article.url == obj.url %}chose{% endif %}" onclick="choseItemTreeDocumentation(this)" data-url="{% url 'docs_art_page' cur_version.url obj.url %}">
|
||||
{{ name }}
|
||||
</div>
|
||||
<div class="element_third_level_content_part_tree" onclick="choseItemTreeDocumentation(this)" data-url="{% url 'docs_art_page' cur_version.url obj.url %}">
|
||||
<div class="element_third_level_content_part_tree {% if cur_article.url == obj.url %}chose{% endif %}" onclick="choseItemTreeDocumentation(this)" data-url="{% url 'docs_art_page' cur_version.url obj.url %}">
|
||||
{{ name }}
|
||||
</div>
|
||||
<div class="element_third_level_content_part_tree" onclick="choseItemTreeDocumentation(this)" data-url="{% url 'docs_art_page' cur_version.url obj.url %}">
|
||||
<div class="element_third_level_content_part_tree {% if cur_article.url == obj.url %}chose{% endif %}" onclick="choseItemTreeDocumentation(this)" data-url="{% url 'docs_art_page' cur_version.url obj.url %}">
|
||||
{{ name }}
|
||||
</div>
|
||||
<div class="element_third_level_content_part_tree chose" onclick="choseItemTreeDocumentation(this)" data-url="{% url 'docs_art_page' cur_version.url obj.url %}">
|
||||
<div class="element_third_level_content_part_tree {% if cur_article.url == obj.url %}chose{% endif %}" onclick="choseItemTreeDocumentation(this)" data-url="{% url 'docs_art_page' cur_version.url obj.url %}">
|
||||
{{ name }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user