This commit is contained in:
2023-11-05 14:20:43 +03:00
parent cd748dc371
commit 93401402ca
6 changed files with 86 additions and 27 deletions

View File

@@ -398,26 +398,34 @@
}
.menu_buttons{
background: #FFFFFF;
height: 100vh;
z-index: 18;
top: 46px;
overflow: auto;
}
.menu_buttons.close{
left: -320px;
transition: 200ms;
position: absolute;
width: 352px;
width: 320px;
}
.menu_buttons.open{
left: 0;
transition: 200ms;
position: absolute;
padding-top: 10px;
}
.handler_menu.close{
background: #FF613A;
color: #FFFFFF;
left: -49px;
}
.menu_buttons.open .handler_menu{
background: #FFFFFF;
color: #000000;
left: 272px;
}
.menu_buttons.close .handler_menu{
background: #FF613A;
@@ -428,9 +436,10 @@
transform: rotate(90deg);
}
.btns_f_curtain{
width: 11px;
width: 7px;
transition: 200ms;
display: block;
}
.btns_f_curtain.left{
float: left;
@@ -440,31 +449,35 @@
}
.menu_buttons.close .btns_f_curtain{
transition: 200ms;
transform: rotate(90deg);
transform: rotate(270deg);
filter: brightness(0) saturate(100%) invert(100%) sepia(2%) saturate(0%) hue-rotate(162deg) brightness(104%) contrast(103%);
padding-right: 10px;
}
.menu_buttons.open .btns_f_curtain{
transition: 200ms;
transform: rotate(270deg);
transform: rotate(90deg);
filter: brightness(0) saturate(100%) invert(0%) sepia(100%) saturate(21%) hue-rotate(344deg) brightness(105%) contrast(106%);
padding-left: 10px;
}
.text_f_curtain{
display: inline-block;
}
.handler_menu{
width: 127px;
height: 32px;
width: 91px;
height: 18px;
display: block;
position: absolute;
right: -47px;
position: fixed;
right: -79px;
text-align: center;
top: 50%;
top: 39%;
border-radius: 10px 10px 0 0;
padding: 7px 18px 7px 18px;
}
.menu_profile{
width: 320px;
text-align: -webkit-center;
}
.menu_profile>div{

View File

@@ -26,6 +26,20 @@
}
.block_overlay{
height: 100vh;
width: 100vw;
background: rgba(39, 53, 62, 0.7);
backdrop-filter: blur(15px);
z-index: 15;
position: fixed;
top: 46px;
}
.block_overlay.hidden{
display: none;
}
.w-68{
width: 68%;
}
@@ -1913,6 +1927,7 @@
position: absolute;
right: 100px;
z-index: 220;
box-shadow: -1px 4px 10px 0 rgba(198, 199, 203, 0.20), 0 -1px 10px 0 rgba(198, 199, 203, 0.20);
}
.menu_profile_btn.show{
@@ -1921,7 +1936,8 @@
padding: 10px;
width: 230px;
position: absolute;
right: 0;
right: 10px;
top: 60px;
border-radius: 10px;
font-size: 14px;

View File

@@ -634,14 +634,42 @@ function show_header_list () {
}
}
function open_curtain (left,right){
let curtain = ''
if (left){
curtain = document.querySelector(".menu_buttons")
} else if (right) {
curtain = ''
function open_curtain (left=null,right=null,overlay=null){
let body = document.querySelector('body')
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")
} else if (right) {
curtain = ''
}
} else {
let curtains = document.querySelectorAll(".curtain")
let i = 0
curtains.forEach(function (){
let el = curtains[i]
if (el.classList.contains('open')){
curtain = el
}
i++
})
}
curtain.classList.toggle("close")
curtain.classList.toggle("open")
}
if (body.style.overflow === 'hidden'){
body.style.overflow = ''
} else {
body.style.overflow = 'hidden'
}
}

View File

@@ -75,15 +75,7 @@
<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 #}
{% endif %}

View File

@@ -2,7 +2,7 @@
{% load static %}
<section class="profile" >
<div class="menu_buttons close">
<div class="menu_buttons curtain close">
{% 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' %}">

View File

@@ -52,6 +52,16 @@
{% 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' %}
<div class="wrapper_content">