diff --git a/static/css/mobile_styles.css b/static/css/mobile_styles.css new file mode 100644 index 0000000..1ae693f --- /dev/null +++ b/static/css/mobile_styles.css @@ -0,0 +1,198 @@ +/*media breakpoints*/ +@media (max-width: 360px) { + + header{ + padding: 5px 16px; + margin-top: unset; + } + + 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{ + 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; + } + .abbreviation_airport_in_search{ + float: left; + border-top: 2px solid #E6E6E6; + border-right: 2px solid #E6E6E6; + border-bottom: 2px solid #E6E6E6; + height: 95%; + width: 33%; + } + .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; + + } + .to_address_point_txt.find_route{ + float: left; + border-top: 2px solid #E6E6E6; + border-left: 2px solid #E6E6E6; + border-bottom: 2px solid #E6E6E6; + } + + .cont-el-form-search-carrier > input{ + border: 2px solid #E6E6E6; + width: 90%; + } + .cont-el-form-search-carrier.last > select{ + width: 97.5%; + border-radius: 0 0 10px 10px; + border: 2px solid #E6E6E6; + } + .daterangepicker{ + width: 305px; + } + .cont-el-form-search-carrier > button{ + width: 97%; + } + + .button_profile_header{ + display: none; + } + .button_profile_header_mobile{ + display: inline-block ; + } + .header-first>div { + margin-right: 37px; + } + .line_f_header{ + top: 45px; + } + + .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; + } + + + .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..b076cfa 100644 --- a/static/css/styles(boris).css +++ b/static/css/styles(boris).css @@ -957,6 +957,9 @@ height: 20px; width: 88%; padding: 20px 10px; + background: url(/static/img/svg/Calendar.svg) white 50%; + background-repeat: no-repeat; + background-position: right 5% bottom 45%; } @@ -999,9 +1002,9 @@ .abbreviation_airport_in_search{ display: inline-block; - float: right; + float: left; width: 29%; - height: 95%; + height: 97%; border-top: 1px solid #E6E6E6; border-right: 1px solid #E6E6E6; border-bottom: 1px solid #E6E6E6; @@ -1953,7 +1956,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..fb5a448 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; @@ -357,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; } @@ -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,20 @@ 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, +.header-second-item-lang{ display: inline-block; vertical-align: middle; - } span.btn_profile_name { @@ -1060,9 +1070,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; } @@ -2513,7 +2521,7 @@ details[open] summary ~ *{ /*news_block_main_page*/ .news_block_main { display: flex; - margin: 0 80px 120px 80px; + /*margin: 0 80px 120px 80px;*/ justify-content: space-between; flex-wrap: wrap; @@ -2694,160 +2702,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/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/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 @@