0.0.319

static/css/mobile_styles.css

@@ -420,42 +420,88 @@
     .menu_buttons{
         background: #FFFFFF;
         height: 100vh;
-        z-index: 18;
+        z-index: 99;
-        top: 46px;
+        top: 47px;
         overflow: auto;
     }
 
-    .menu_buttons.close{
+    .menu_buttons.right.close{
+        right: -320px;
+        transition: 200ms;
+        position: absolute;
+        width: 320px;
+    }
+
+    .menu_buttons.left.close{
         left: -320px;
         transition: 200ms;
         position: absolute;
         width: 320px;
     }
-    .menu_buttons.open{
+    .menu_buttons.right.open{
-        left: 0;
+        right: 0;
         transition: 200ms;
-        position: absolute;
+        position: fixed;
 
         padding-top: 10px;
     }
-    .handler_menu.close{
+
+    .menu_buttons.left.open{
+        left: 0;
+        transition: 200ms;
+        position: fixed;
+
+        padding-top: 10px;
+    }
+    .handler_menu.left.close{
         background: #FF613A;
         color: #FFFFFF;
         left: -49px;
     }
-    .menu_buttons.open .handler_menu{
+    .handler_menu.right.close{
+        background: #FF613A;
+        color: #FFFFFF;
+        left: -49px;
+    }
+    .menu_buttons.left.open .handler_menu{
         background: #FFFFFF;
         color: #000000;
         left: 272px;
     }
+    .menu_buttons.right.open .handler_menu{
+        background: #FFFFFF;
+        color: #000000;
+        left: -39px;
+    }
     .menu_buttons.close .handler_menu{
         background: #FF613A;
         color: #FFFFFF;
     }
-
+    .menu_buttons.right .handler_menu{
-    .handler_menu{
+        transform: rotate(270deg);
-        transform: rotate(90deg);
+        left: 312px;
+        width: 91px;
+        height: 18px;
+        display: block;
+        position: fixed;
+        text-align: center;
+        top: 39%;
+        border-radius: 10px 10px 0 0;
+        padding: 7px 18px 7px 18px;
     }
+    .menu_buttons.left .handler_menu{
+        transform: rotate(90deg);
+        width: 91px;
+        height: 18px;
+        display: block;
+        position: fixed;
+        left: -48px;
+        text-align: center;
+        top: 39%;
+        border-radius: 10px 10px 0 0;
+        padding: 7px 18px 7px 18px;
+    }
+
     .btns_f_curtain{
         width: 7px;
         transition: 200ms;
@@ -484,17 +530,6 @@
      .text_f_curtain{
          display: inline-block;
      }
-    .handler_menu{
-        width: 91px;
-        height: 18px;
-        display: block;
-        position: fixed;
-        right: -79px;
-        text-align: center;
-        top: 39%;
-        border-radius: 10px 10px 0 0;
-        padding: 7px 18px 7px 18px;
-    }
 
     .menu_profile{
         width: 320px;

static/css/styles(boris).css

@@ -31,7 +31,7 @@
     width: 100vw;
     background: rgba(39, 53, 62, 0.7);
     backdrop-filter: blur(15px);
-    z-index: 15;
+    z-index: 100;
     position: fixed;
     top: 46px;
 }

static/js/user_profile.js

@@ -719,7 +719,7 @@ function editRoute(id) {
 function showMenu(el, event) {
     let menu = document.querySelector('.dropdown-content')
         menu.classList.add('show')
-
+    closeCurtain()
 
 }
 function hideMenu(event) {

static/js/user_profile_2.js

@@ -54,6 +54,7 @@ function select_tab_profile (el,url,owner_type=null) {
 
 
             middleWareJS()
+            closeCurtain()
 
         },
         error: function (data){
@@ -631,45 +632,100 @@ function show_header_list () {
     let el = document.querySelector(".menu_profile_btn")
     if (el) {
         el.classList.toggle("show")
+        closeCurtain()
+    }
+}
+
+function closeCurtain () {
+    let curtain = getOpenCurtain()
+    if (curtain){
+        open_curtain(null,null,null,'close')
     }
 }
 
 
-function open_curtain (left=null,right=null,overlay=null){
+function open_curtain (left=null,right=null,overlay=null,close=null){
-    let body = document.querySelector('body')
+    let curtain_name = ''
     let curtain = ''
-    if (overlay){
-        overlay.classList.toggle("hidden")
-    } else {
-        let overlay = document.querySelector(".block_overlay")
-        if (overlay){
-            overlay.classList.toggle("hidden")
-        }
-    }
     if (left || right){
         if (left){
-            curtain = document.querySelector(".menu_buttons")
+            curtain = document.querySelector(".menu_buttons.left")
+            curtain.style.zIndex = '101'
+            document.querySelector(".menu_buttons.right").style.zIndex = '99'
+            curtain_name = curtain.dataset['name']
         } else if (right) {
-            curtain = ''
+            curtain = document.querySelector(".menu_buttons.right")
+            curtain.style.zIndex = '101'
+            document.querySelector(".menu_buttons.left").style.zIndex = '99'
+            curtain_name = curtain.dataset['name']
         }
     } else {
-        let curtains = document.querySelectorAll(".curtain")
+        curtain = getOpenCurtain()
-        let i = 0
+        curtain_name = getNameCurtain()
-        curtains.forEach(function (){
-            let el = curtains[i]
-            if (el.classList.contains('open')){
-                curtain = el
-            }
-            i++
-        })
     }
-    curtain.classList.toggle("close")
+    let body = document.querySelector('body')
-    curtain.classList.toggle("open")
+    if (close){
-    if (body.style.overflow === 'hidden'){
+        // curtain = getOpenCurtain()
-        body.style.overflow = ''
+        let handler_text = curtain.querySelector('.text_f_curtain')
+        handler_text.innerHTML = curtain_name
+        curtain.classList.remove("open")
+        curtain.classList.add("close")
+        let overlay = document.querySelector(".block_overlay")
+        overlay.classList.add('hidden')
     } else {
-        body.style.overflow = 'hidden'
+        if (overlay){
+            overlay.classList.toggle("hidden")
+        } else {
+            let overlay = document.querySelector(".block_overlay")
+            if (overlay){
+                overlay.classList.toggle("hidden")
+            }
+        }
+
+        curtain.classList.toggle("close")
+        curtain.classList.toggle("open")
+        let handler_text = curtain.querySelector('.text_f_curtain')
+        if (curtain.classList.contains('open')){
+            handler_text.innerHTML = 'Закрыть'
+            handler_text.style.fontSize = '13px'
+        } else {
+            handler_text.innerHTML = curtain_name
+            handler_text.style.fontSize = '16px'
+        }
+        if (body.style.overflow === 'hidden'){
+            body.style.overflow = ''
+        } else {
+            body.style.overflow = 'hidden'
+        }
     }
 
+
 }
 
+function getNameCurtain () {
+    let curtain = getOpenCurtain()
+    let dataset = curtain.dataset
+    let name = ''
+    if (dataset){
+        name = dataset['name']
+        return name
+    }
+}
+
+function getOpenCurtain () {
+    let curtains = document.querySelectorAll(".curtain")
+    let i = 0
+    let curtain = ''
+    curtains.forEach(function (){
+        let el = curtains[i]
+        if (el.classList.contains('open')){
+            curtain = el
+        }
+        i++
+    })
+    if (!curtain){
+        curtain = document.querySelector('.curtain')
+        console.log(`not finded open curtain choice first curtain named=${curtain.dataset['name']}`)
+    }
+    return curtain
+}

templates/blocks/b_header.html

@@ -71,10 +71,18 @@
                               </div>
                             </div>
                         </div>
-                    <div class="button_profile_header_mobile" onclick="show_header_list()">
+                    <div class="button_profile_header_mobile" onclick="open_curtain(null,'right')">
                         <img src="/static/img/svg/userMobile.svg" alt="">
                     </div>
-
+                    <div class="menu_profile_btn">
+                        {% if user_subscribe %}<div class="subscribe_type_txt"><span class="f-l">Подписка:</span> <span class="f-r">{{ user_subscribe.subscribe.name }}</span><div class="clear_both"></div></div>{% endif %}
+                        <a class="btn_menu_profile" href="{% url "user_profile" %}" >Перейти в профиль</a>
+                        <a class="btn_menu_profile" href="{% url 'profile_page' 'create_route_for_mover' %}">Перевезти посылку</a>
+                        <a class="btn_menu_profile" href="{% url 'profile_page' 'create_route_for_customer' %}">Отправить посылку</a>
+                        <a class="btn_menu_profile" href="{% url 'profile_page' 'my_routes' %}" >Мои объявления</a>
+                        <div class="separator_menu_profile"></div>
+                        <a href="/profile/logout" class="btn_menu_profile">Выйти из профиля</a>
+                    </div>
 
                     </div>
                 {# end #}

templates/blocks/b_user_profile.html

@@ -2,7 +2,7 @@
 {% load static %}
 
 <section class="profile" >
-    <div class="menu_buttons curtain close">
+    <div class="menu_buttons curtain left close" data-name="Меню">
         {% include "blocks/profile/b_buttons_menu_profile.html" %}
         <div class="handler_menu close" onclick="open_curtain('left')">
             <img class="btns_f_curtain close left" src="{% static 'img/svg/arrow_f_curtain.svg' %}">
@@ -22,5 +22,14 @@
 {#            {% include "blocks/profile/b_chats.html" %}#}
         {% endif %}
     </div>
-<div class="clear_both"></div>
+    <div class="clear_both"></div>
+    <div class="menu_buttons curtain right close" data-name="Пользователи">
+        {% include "blocks/profile/b_buttons_menu_profile.html" %}
+        <div class="handler_menu close" onclick="open_curtain(null,'right')">
+            <img class="btns_f_curtain close left" src="{% static 'img/svg/arrow_f_curtain.svg' %}">
+            <div class="text_f_curtain left">Пользователи</div>
+            <img class="btns_f_curtain close right"  src="{% static 'img/svg/arrow_f_curtain.svg' %}">
+            <div class="clear_both"></div>
+        </div>
+    </div>
   </section>

templates/tb_base.html

@@ -52,15 +52,7 @@
     {% endblock %}
 </head>
 <body>
-<div class="menu_profile_btn">
+
-    {% if user_subscribe %}<div class="subscribe_type_txt"><span class="f-l">Подписка:</span> <span class="f-r">{{ user_subscribe.subscribe.name }}</span><div class="clear_both"></div></div>{% endif %}
-    <a class="btn_menu_profile" href="{% url "user_profile" %}" >Перейти в профиль</a>
-    <a class="btn_menu_profile" href="{% url 'profile_page' 'create_route_for_mover' %}">Перевезти посылку</a>
-    <a class="btn_menu_profile" href="{% url 'profile_page' 'create_route_for_customer' %}">Отправить посылку</a>
-    <a class="btn_menu_profile" href="{% url 'profile_page' 'my_routes' %}" >Мои объявления</a>
-    <div class="separator_menu_profile"></div>
-    <a href="/profile/logout" class="btn_menu_profile">Выйти из профиля</a>
-</div>
 <div class="block_overlay hidden" onclick="open_curtain()"></div>
 <div class="wrapper_main">
     {% include 'blocks/b_header.html' %}