From 31833000bb385186a10cd9a7aca4c6c545994569 Mon Sep 17 00:00:00 2001 From: ArtemB Date: Thu, 26 Oct 2023 13:11:51 +0300 Subject: [PATCH 1/4] 0.0.182 media 360px v.3 --- static/css/mobile_styles.css | 155 ++++++++++++++++++++++++++ static/css/styles(boris).css | 2 +- static/css/styles.css | 195 ++++----------------------------- templates/blocks/b_header.html | 7 +- templates/tb_base.html | 16 +-- 5 files changed, 193 insertions(+), 182 deletions(-) create mode 100644 static/css/mobile_styles.css diff --git a/static/css/mobile_styles.css b/static/css/mobile_styles.css new file mode 100644 index 0000000..77cec30 --- /dev/null +++ b/static/css/mobile_styles.css @@ -0,0 +1,155 @@ +/*media breakpoints*/ +@media (max-width: 360px) { + + header{ + padding: 5px 16px; + } + + header .header-second { + margin-left: unset; + } + .header_big_background{ + height: 45px; + } + + .header_logo_mobile{ + display: inline-block ; + + } + .header_logo{ + display: none; + } + + .container_form_search_carrier{ + margin: 10px; + } + + + .button_profile_header{ + display: none; + } + .button_profile_header_mobile{ + display: inline-block ; + } + .header-first>div { + margin-right: 37px; + } + .line_f_header{ + top: 44px; + } + + .top_block_static_wrapper_main{ + background: unset; + } + .header_big_background { + max-width: 100%; + } + #sub_title_static>p{ + white-space: normal; + } + .top_block_static{ + padding: 0; + } + .mid_block_static{ + padding: 0; + } + .wrapper_tab_button{ + width: 55%; + } + .benefit_img{ + flex-wrap: wrap; + } + .tab-btn-2{ + margin: 0 0 5px 0; + } + button#more_button{ + width: 100%; + } + #title_static{ + font-size: 34px; + line-height: 42px; + } + .cards_wrapper{ + flex-direction: column; + } + + .cards_item_1, + .cards_item_2, + .cards_item_3, + .cards_item_4 + { + width: 100%; + height: 180px; + background-size:60%; + } + .card_title_1{ + font-size: 34px; + font-style: normal; + font-weight: 700; + line-height: 42px; + margin: 22px 0 0 10px; + text-shadow: 1px 1px 0px #272424; + } + .card_title_2{ + font-size: 17px; + font-style: normal; + font-weight: 600; + line-height: 26px; + margin: 10px 0 0 10px; + text-shadow: 1px 1px 0px #272424; + } + .card_title_3{ + margin: 10px 0 0 10px; + width: 95%; + font-size: 12px; + font-style: normal; + font-weight: 400; + line-height: 20px; + text-shadow: 1px 1px 0px #272424; + } + + summary{ + font-size: 18px; + font-style: normal; + font-weight: 600; + line-height: 26px; + margin: 0; + } + summary ~ * { + padding: 0 1em 10px 1.4em; + font-size: 14px; + font-style: normal; + font-weight: 400; + line-height: 20px; + } + .news_block_main { + margin: 0 16px 120px 16px; + } + .news_item { + margin-bottom: 20px; + } + .container_form_search_carrier{ + flex-direction: column; + margin-top: 170px; + width: unset; + } + + .header-second-item, + .header_btn_sender, + .header_btn_mover{ + display: none; + } + + + + +} + +@media (max-width: 992px) { + .benefit_img>img{ + display: none; + } +} + + +/*END media breakpoints*/ \ No newline at end of file diff --git a/static/css/styles(boris).css b/static/css/styles(boris).css index b26d619..5b9607b 100644 --- a/static/css/styles(boris).css +++ b/static/css/styles(boris).css @@ -1953,7 +1953,7 @@ .header_big_background{ height: 90px; background: #F8F8F8; - width: 1440px; + width: 1280px; position: absolute; z-index: 3; } diff --git a/static/css/styles.css b/static/css/styles.css index d7e3e6e..0ec8876 100644 --- a/static/css/styles.css +++ b/static/css/styles.css @@ -139,10 +139,15 @@ html, body{ height: 100%; } -.wrapper { - max-width: 1440px; +.wrapper_content { + margin: 55px auto;; + /*padding: 40px 5px;*/ + +} + +.wrapper_main{ + max-width: 1280px; margin: auto; - padding: 40px 5px; } @@ -214,8 +219,7 @@ body { } header { - /*width: 1280px;*/ - /*margin: 0 50px;*/ + margin-top: 20px; padding: 5px 40px; position: sticky; z-index: 4; @@ -480,14 +484,18 @@ footer>div { } header .header-first { - display: inline-block; + float: left; + margin-top: 12px; } .header_logo_mobile{ - display: none !important; + display: none; } -.header-first>div{ + +.header_logo, +.header_btn_mover, +.header_btn_sender{ margin-right: 40px; display: inline-block; vertical-align: middle; @@ -508,7 +516,7 @@ header .header-first { .dropbtn { color: white; - + margin-right: 40px; font-size: 16px; border: none; } @@ -586,18 +594,19 @@ header>div>div>a { } header .header-second { - display: inline-block; - margin-left: 20%; + float: right; } .button_profile_header_mobile{ - display: none !important; + display: none; } -.header-second>div { + + +.header-second-item, +.cont_header_btn_profile{ display: inline-block; vertical-align: middle; - } span.btn_profile_name { @@ -1060,9 +1069,7 @@ section.login>form>div>div:nth-child(5)>a { } section.profile { - max-width: 1280px; - margin: auto; - padding: 120px 40px 0; + padding: 60px 40px 0; margin-bottom: 120px; } @@ -2694,160 +2701,6 @@ details[open] summary ~ *{ /*END news articles all*/ -/*media breakpoints*/ -@media (max-width: 360px) { - - header{ - padding: 5px 16px; - } - - header .header-second { - margin-left: unset; - } - .header_big_background{ - height: 45px!important; - } - - .header_logo_mobile{ - display: inline-block !important; - - } - .header_logo{ - display: none!important; - } - - .container_form_search_carrier{ - margin: 10px; - } - - - .button_profile_header{ - display: none; - } - .button_profile_header_mobile{ - display: inline-block !important; - } - .header-first>div { - margin-right: 37px; - } - .line_f_header{ - top: 44px!important; - } - - .top_block_static_wrapper_main{ - background: unset; - } - .header_big_background { - max-width: 100%; - } - #sub_title_static>p{ - white-space: normal; - } - .top_block_static{ - padding: 0; - } - .mid_block_static{ - padding: 0; - } - .wrapper_tab_button{ - width: 55%; - } - .benefit_img{ - flex-wrap: wrap; - } - .tab-btn-2{ - margin: 0 0 5px 0; - } - button#more_button{ - width: 100%; - } - #title_static{ - font-size: 34px; - line-height: 42px; - } - .cards_wrapper{ - flex-direction: column; - } - - .cards_item_1, - .cards_item_2, - .cards_item_3, - .cards_item_4 - { - width: 100%; - height: 180px; - background-size:60%; - } - .card_title_1{ - font-size: 34px; - font-style: normal; - font-weight: 700; - line-height: 42px; - margin: 22px 0 0 10px; - text-shadow: 1px 1px 0px #272424; - } - .card_title_2{ - font-size: 17px; - font-style: normal; - font-weight: 600; - line-height: 26px; - margin: 10px 0 0 10px; - text-shadow: 1px 1px 0px #272424; - } - .card_title_3{ - margin: 10px 0 0 10px; - width: 95%; - font-size: 12px; - font-style: normal; - font-weight: 400; - line-height: 20px; - text-shadow: 1px 1px 0px #272424; - } - - summary{ - font-size: 18px; - font-style: normal; - font-weight: 600; - line-height: 26px; - margin: 0; - } - summary ~ * { - padding: 0 1em 10px 1.4em; - font-size: 14px; - font-style: normal; - font-weight: 400; - line-height: 20px; - } - .news_block_main { - margin: 0 16px 120px 16px; - } - .news_item { - margin-bottom: 20px; - } - .container_form_search_carrier{ - flex-direction: column; - margin-top: 170px !important; - width: unset !important; - } - - .header-second-item, - .header_btn_sender, - .header_btn_mover{ - display: none!important; - } - -} - -@media (max-width: 992px) { - .benefit_img>img{ - display: none; - } -} - - -/*END media breakpoints*/ - - diff --git a/templates/blocks/b_header.html b/templates/blocks/b_header.html index 081ac97..bc2cf2b 100644 --- a/templates/blocks/b_header.html +++ b/templates/blocks/b_header.html @@ -1,5 +1,7 @@ {% load i18n %} {% load base_tags_extra %} +
+
-
+
\ No newline at end of file + +
\ No newline at end of file diff --git a/templates/tb_base.html b/templates/tb_base.html index ae37c57..be37c7c 100644 --- a/templates/tb_base.html +++ b/templates/tb_base.html @@ -34,8 +34,8 @@ - + @@ -52,17 +52,17 @@ {% endblock %} -
-{# modifided by boris#} -
-
+
{% include 'blocks/b_header.html' %} -
+
- {% block content %} - {% endblock %} + {% block content %} + {% endblock %} + +
+ {% include 'blocks/b_footer.html' %} From d3fd7b7428ac2b8e7a8017c12b6ed85cc4943a8d Mon Sep 17 00:00:00 2001 From: ArtemB Date: Thu, 26 Oct 2023 16:26:29 +0300 Subject: [PATCH 2/4] 0.0.183 media 360px v.3.1 --- static/css/mobile_styles.css | 26 +++++-- static/css/styles.css | 11 +-- static/js/global_js.js | 16 +--- static/js/user_profile.js | 75 ++++++++++++++++--- templates/blocks/b_footer.html | 14 ++-- templates/blocks/b_header.html | 6 +- .../f_find_route_form_main_find_routes.html | 2 +- 7 files changed, 104 insertions(+), 46 deletions(-) diff --git a/static/css/mobile_styles.css b/static/css/mobile_styles.css index 77cec30..347fe2c 100644 --- a/static/css/mobile_styles.css +++ b/static/css/mobile_styles.css @@ -20,10 +20,26 @@ display: none; } - .container_form_search_carrier{ - margin: 10px; + .container_form_search_carrier{ + flex-direction: column; + width: unset; + margin: 170px 10px 10px 10px; } + #abbreviation_airport_in_search{ + float: left; + height: 95%; + border-radius: 0 10px 0 0; + border-top: 2px solid #E6E6E6; + border-right: 2px solid #E6E6E6; + border-bottom: 2px solid #E6E6E6; + } + .from_address_point_txt.find_route.first{ + border-radius: 10px 0 0 0; + border-top: 2px solid #E6E6E6; + border-bottom: 2px solid #E6E6E6; + border-left: 2px solid #E6E6E6; + } .button_profile_header{ display: none; @@ -128,11 +144,7 @@ .news_item { margin-bottom: 20px; } - .container_form_search_carrier{ - flex-direction: column; - margin-top: 170px; - width: unset; - } + .header-second-item, .header_btn_sender, diff --git a/static/css/styles.css b/static/css/styles.css index 0ec8876..9ea149d 100644 --- a/static/css/styles.css +++ b/static/css/styles.css @@ -361,16 +361,16 @@ footer>div { color: #272424; } -.sf_1-column{ +.sf_1_column{ padding-left: 80px; padding-right: 230px; } -.sf_2-column, -.sf_3-column +.sf_2_column, +.sf_3_column { padding-right: 40px; } -.sf_4-column{ +.sf_4_column{ display: inline-block; } @@ -604,7 +604,8 @@ header .header-second { .header-second-item, -.cont_header_btn_profile{ +.cont_header_btn_profile, +.header-second-item-lang{ display: inline-block; vertical-align: middle; } diff --git a/static/js/global_js.js b/static/js/global_js.js index 0d169aa..4fe044d 100644 --- a/static/js/global_js.js +++ b/static/js/global_js.js @@ -51,21 +51,7 @@ window.addEventListener('scroll', () => { // Действия при изменении URL -// function changeImgLang(el) { -// -// let img = document.getElementById('dropbtn_lang') -// -// if (el.innerText === 'RU'){ -// img.style.background = "url('/static/img/png/ru.png') no-repeat left center;" -// } -// else if(el.innerText === 'EN'){ -// img.style.background = "url('/static/img/png/en.png')" -// img.style.backgroundRepeat = "no-repeat" -// img.style.backgroundPosition = "left center" -// -// } -// -// } + diff --git a/static/js/user_profile.js b/static/js/user_profile.js index a9e4172..26b8651 100644 --- a/static/js/user_profile.js +++ b/static/js/user_profile.js @@ -15,12 +15,22 @@ function writeMessage(el){ document.querySelector(".info_profile").innerHTML = data.html; let list_div = document.querySelectorAll('.menu_profile div'); + let ru_lang = document.getElementById('ru_lang'); + let en_lang = document.getElementById('en_lang'); + ru_lang.pathname = "/ru/profile/page/chat/"; + en_lang.pathname = "/en/profile/page/chat/"; list_div.forEach(el=>{ el.classList.remove('selected'); }); el.classList.add('selected') let body = document.querySelector("body") body.style.overflow = "hidden" //updating the url without reloading - window.history.pushState(null, null, '/ru/profile/page/chat/') + if (window.location.href.indexOf("/ru/") > -1) { + window.history.pushState(null, null, '/ru/profile/page/chat/') + + } else if(window.location.href.indexOf("/en/") > -1){ + window.history.pushState(null, null, '/en/profile/page/chat/') + } + middleWareJS() }, @@ -33,6 +43,7 @@ function writeMessage(el){ function technicalSupport(el){ + console.log(el) $.ajax({ headers: { "X-CSRFToken": $('input[name=csrfmiddlewaretoken]').val() }, url: '/user_account/support_tickets/', @@ -50,11 +61,20 @@ function technicalSupport(el){ document.querySelector(".info_profile").innerHTML = data.html; let list_div = document.querySelectorAll('.menu_profile div'); + let ru_lang = document.getElementById('ru_lang'); + let en_lang = document.getElementById('en_lang'); + ru_lang.pathname = "/ru/profile/page/support/"; + en_lang.pathname = "/en/profile/page/support/"; list_div.forEach(el=>{ el.classList.remove('selected'); }); el.classList.add('selected') //updating the url without reloading - window.history.pushState(null, null, '/ru/profile/page/support/') + if (window.location.href.indexOf("/ru/") > -1) { + window.history.pushState(null, null, '/ru/profile/page/support/') + + } else if(window.location.href.indexOf("/en/") > -1){ + window.history.pushState(null, null, '/en/profile/page/support/') + } middleWareJS() }, @@ -82,13 +102,21 @@ function mySubscription(el){ // location.href = '/profile' // document.querySelector(".info_profile").innerHTML = data.html; - + let ru_lang = document.getElementById('ru_lang'); + let en_lang = document.getElementById('en_lang'); + ru_lang.pathname = "/ru/profile/page/my_subscribe/"; + en_lang.pathname = "/en/profile/page/my_subscribe/"; let list_div = document.querySelectorAll('.menu_profile div'); list_div.forEach(el=>{ el.classList.remove('selected'); }); el.classList.add('selected') //updating the url without reloading - window.history.pushState(null, null, '/ru/profile/page/my_subscribe/') + if (window.location.href.indexOf("/ru/") > -1) { + window.history.pushState(null, null, '/ru/profile/page/my_subscribe/') + + } else if(window.location.href.indexOf("/en/") > -1){ + window.history.pushState(null, null, '/en/profile/page/my_subscribe/') + } middleWareJS() }, @@ -114,13 +142,21 @@ function myProfile(el){ // location.href = '/profile' document.querySelector(".info_profile").innerHTML = data.html; - + let ru_lang = document.getElementById('ru_lang'); + let en_lang = document.getElementById('en_lang'); + ru_lang.pathname = "/ru/profile/page/change_profile/"; + en_lang.pathname = "/en/profile/page/change_profile/"; let list_div = document.querySelectorAll('.menu_profile div'); list_div.forEach(el=>{ el.classList.remove('selected'); }); el.classList.add('selected') //updating the url without reloading - window.history.pushState(null, null, '/ru/profile/page/change_profile/') + if (window.location.href.indexOf("/ru/") > -1) { + window.history.pushState(null, null, '/ru/profile/page/change_profile/') + + } else if(window.location.href.indexOf("/en/") > -1){ + window.history.pushState(null, null, '/en/profile/page/change_profile/') + } middleWareJS() }, @@ -608,14 +644,22 @@ function createRoute(el, owner_type){ document.querySelector(".info_profile").innerHTML = data.html let list_div = document.querySelectorAll('.menu_profile div'); + let ru_lang = document.getElementById('ru_lang'); + let en_lang = document.getElementById('en_lang'); + list_div.forEach(el=>{ el.classList.remove('selected'); }); el.classList.add('selected') - //updating the url without reloading - if(el.id == 'customer'){ + // updating the url without reload + + if(el.id === 'customer'){ window.history.pushState(null, null, '/ru/profile/page/create_route_for_customer/') + ru_lang.pathname = "/ru/profile/page/create_route_for_customer/"; + en_lang.pathname = "/en/profile/page/create_route_for_customer/"; } else { window.history.pushState(null, null, '/ru/profile/page/create_route_for_mover/') + ru_lang.pathname = "/ru/profile/page/create_route_for_mover/"; + en_lang.pathname = "/en/profile/page/create_route_for_mover/"; } middleWareJS() @@ -657,13 +701,26 @@ function getRoute(el){ // location.href = '/profile' + document.querySelector(".info_profile").innerHTML = data.html; + let ru_lang = document.getElementById('ru_lang'); + let en_lang = document.getElementById('en_lang'); + ru_lang.pathname = "/ru/profile/page/my_routes/"; + en_lang.pathname = "/en/profile/page/my_routes/"; + let list_div = document.querySelectorAll('.menu_profile div'); list_div.forEach(el=>{ el.classList.remove('selected'); }); el.classList.add('selected') - window.history.pushState(null, null, '/ru/profile/page/my_routes/') + if (window.location.href.indexOf("/ru/") > -1) { + window.history.pushState(null, null, '/ru/profile/page/my_routes/') + + } else if(window.location.href.indexOf("/en/") > -1){ + window.history.pushState(null, null, '/en/profile/page/my_routes/') + } + + middleWareJS() diff --git a/templates/blocks/b_footer.html b/templates/blocks/b_footer.html index 49aecae..86a6c1c 100644 --- a/templates/blocks/b_footer.html +++ b/templates/blocks/b_footer.html @@ -68,14 +68,16 @@