0.0.51

static/aerbimCSSMOBILE.css

@@ -87,6 +87,44 @@
     .cut-width{
         margin: 0 20px;
     }
+/*    curtain*/
+    .curtain_main{
+        height: calc(100vh - 20px);
+        padding-top: 20px;
+        background: #10212B;
+        width: 320px;
+        position: fixed;
+        top: 40px;
+        right: 0;
+        z-index: 101;
+        transition: 200ms;
+    }
+    .curtain_main.open{
+        right: 0;
+        transition: 200ms;
+    }
+    .curtain_main.close{
+        right: -320px;
+        transition: 200ms;
+    }
+
+    .container_first_line_curtain{
+        padding-bottom: 20px;
+        border-bottom: 1px solid #888;
+        width: 100%;
+    }
+    .block_overlay{
+        height: 100vh;
+        width: 100vw;
+        position: absolute;
+        z-index: 100;
+    }
+    .block_overlay.hide{
+        display: none;
+    }
+    .block_overlay.show{
+        display: block;
+    }
 }
 
 @media (max-width: 850px) {
@@ -104,6 +142,11 @@
     .text_header{
         padding-right: 20px;
     }
+    .section_btn:hover {
+        height: unset;
+        position: unset;
+        bottom: unset;
+    }
     .text_header.last_left {
         padding-right: 20px;
     }
@@ -129,6 +172,9 @@
     }
     .section_btn.open{
         height: unset;
+        bottom: unset;
+        position: unset;
+        border-radius: 0;
     }
     .section_btn.close{
         height: unset;
@@ -151,6 +197,7 @@
     }
     .section_btn:hover{
         height: unset;
+        border-radius: 0;
     }
     .img_go_to_section{
         width: 8px;
@@ -171,7 +218,22 @@
     }
 }
 
-@media (max-width: 675px) {
-
+@media (max-width: 700px) {
+    .flex_container_footer{
+        flex-wrap: wrap;
+        justify-content: right;
+    }
+    .footer_els_container{
+        width: 100%;
+    }
+    .right_part_footer{
+        width: calc(100% - 100px);
+        text-align: -webkit-right;
+        float: right;
+        margin-top: 60px;
+    }
+    .footer_el{
+        width: 100%;
+    }
 
 }

static/aerbimJS.js

@@ -1,10 +1,11 @@
 $(document).ready(function (){
-    if (document.querySelector(".header").dataset['page'] === 'True'){
+    if (document.querySelector(".header").dataset['page'] === 'True' && getInfoAboutUser()[0] === 'mobile'){
         renderContent()
     } else {
         let el = document.querySelector(".container_sections_buttons")
         if (el){
             replaceHrefOnOnclick()
+            replace_select_language()
         }
     }
 })
@@ -69,6 +70,10 @@ function renderContent (el=null) {
 
 function replace_select_language () {
     let select = document.querySelector(".name_language")
+    if (getInfoAboutUser()[0] === 'mobile' || getInfoAboutUser()[0] === 'laptop'){
+        select = document.querySelector(".name_language.curtain")
+    }
+
     let lang_f_replace = ''
     if (window.location.href.includes('ru')){
         lang_f_replace = 'ru'
@@ -104,6 +109,9 @@ function faq_open_close () {
 
 function open_select_language () {
     let el = document.querySelector(".language_select")
+    if (getInfoAboutUser()[0] === 'mobile' || getInfoAboutUser()[0] === 'laptop'){
+        el = document.querySelector(".language_select.curtain")
+    }
     el.classList.toggle("open")
     el.classList.toggle("close")
 }
@@ -111,6 +119,9 @@ function open_select_language () {
 function select_language (el) {
     let txt = el.innerHTML
     let select = document.querySelector(".name_language")
+    if (getInfoAboutUser()[0] === 'mobile' || getInfoAboutUser()[0] === 'laptop'){
+        select = document.querySelector(".name_language.curtain")
+    }
     select.innerHTML = txt
     let lang_f_replace = ''
     if (window.location.href.includes('ru')){
@@ -120,4 +131,19 @@ function select_language (el) {
     }
     window.location.href = window.location.href.replace(`${lang_f_replace}`,txt.toLowerCase())
     open_select_language()
+}
+
+
+// curtain
+function openCurtain (el) {
+    let curtain = document.querySelector(".curtain")
+    curtain.classList.toggle("open")
+    curtain.classList.toggle("close")
+    openOverlay()
+}
+
+function openOverlay () {
+    let overlay = document.querySelector(".block_overlay")
+    overlay.classList.toggle("show")
+    overlay.classList.toggle("hide")
 }

templates/blocks/b_curtain.html

@@ -0,0 +1,23 @@
+{% load static %}
+<div class="curtain curtain_main close">
+    <div class="cut-width">
+        <div class="container_curtain_content">
+            <div class="container_first_line_curtain">
+                <div class="language_select close curtain">
+                    <div class="first_line_language_select pointer" onclick="open_select_language()">
+                        <div class="name_language standart_txt curtain">RU</div>
+                        <div class="arrow_language_select">
+                            <img class="img_arrow_language_select" src="{% static "images/language_icon.svg" %}">
+                        </div>
+                        <div class="clear_both"></div>
+                    </div>
+                    <div class="content_select_language">
+                        <div class="standart_txt pointer" onclick="select_language(this)">RU</div>
+                        <div class="splinner_select_language"></div>
+                        <div class="standart_txt pointer" onclick="select_language(this)">EN</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

templates/blocks/static/header.html

@@ -29,7 +29,7 @@
             <a class="standart_txt text_header last_right orange pointer">Личный кабинет</a>
         </div>
         <div class="right_part_header_mobile">
-            <img class="burger_menu_header" src="{% static "/images/burger_menu.svg" %}">
+            <img onclick="openCurtain(this)" class="burger_menu_header" src="{% static "/images/burger_menu.svg" %}">
         </div>
     </div>
 </div>

templates/tb_base.html

@@ -16,7 +16,10 @@
     </head>
     <body>
     {% csrf_token %}
+        <div class="block_overlay"></div>
         {% include "blocks/static/header.html" %}
+        {% include "blocks/b_curtain.html" %}
+
         <div class="content">
             {% block CONTENT %}