From 9b94b56c6e8173ddf85bcfa30b3e6783740c2254 Mon Sep 17 00:00:00 2001 From: ArtemB Date: Tue, 24 Oct 2023 16:42:00 +0300 Subject: [PATCH] 0.0.179 media 320px v.2 --- static/css/styles.css | 150 +++++++++++++++++++++++++++++---- static/img/svg/LogoMobile.svg | 5 ++ static/img/svg/userMobile.svg | 5 ++ templates/blocks/b_header.html | 61 +++++++++----- templates/pages/p_main.html | 40 ++++----- 5 files changed, 201 insertions(+), 60 deletions(-) create mode 100644 static/img/svg/LogoMobile.svg create mode 100644 static/img/svg/userMobile.svg diff --git a/static/css/styles.css b/static/css/styles.css index 272e2ab..ad861f2 100644 --- a/static/css/styles.css +++ b/static/css/styles.css @@ -472,11 +472,13 @@ footer>div { } header .header-first { - float: left; - - margin-top: 13px; + display: inline-block; } + +.header_logo_mobile{ + display: none !important; + } .header-first>div{ margin-right: 40px; display: inline-block; @@ -576,11 +578,14 @@ header>div>div>a { } header .header-second { - float: right; - align-items: center; - justify-content: space-between; + display: inline-block; + margin-left: 20%; } + +.button_profile_header_mobile{ + display: none !important; + } .header-second>div { display: inline-block; vertical-align: middle; @@ -2162,10 +2167,10 @@ button#send_feedback_form{ color: #FF613A; text-align: center; font-family: Inter; - font-size: 44px; + font-size: inherit; font-style: normal; font-weight: 700; - line-height: 52px; + line-height: inherit; margin-bottom: 20px; } @@ -2295,7 +2300,7 @@ button#send_feedback_form{ width: 48%; height: 322px; border-radius: 10px; - background: url(/static/img/png/cards_item_1.png) #242223 50%; + background: url(/static/img/png/cards_item_1.png) #1d1e20 50%; background-repeat: no-repeat; background-position: right; @@ -2327,7 +2332,9 @@ button#send_feedback_form{ width: 48%; height: 322px; border-radius: 10px; - background: #FFF; + background: url(/static/img/png/cards_item_2.png) white 50%; + background-repeat: no-repeat; + background-position: right; /* Shadow 1 */ box-shadow: -1px 4px 10px 0px rgba(198, 199, 203, 0.20), 0px -1px 10px 0px rgba(198, 199, 203, 0.20); @@ -2335,9 +2342,11 @@ button#send_feedback_form{ } -.cards_item_2_left>div, -.cards_item_3_left>div{ +.cards_item_2>div, +.cards_item_3>div{ color: black; + text-shadow: none; + text-shadow: 1px 1px 0px #ffffff; } .cards_item_2_right{ @@ -2368,7 +2377,9 @@ button#send_feedback_form{ width: 48%; height: 322px; border-radius: 10px; - background: #FFF; + background: url(/static/img/png/cards_item_3.png) white 50%; + background-repeat: no-repeat; + background-position: right; box-shadow: -1px 4px 10px 0px rgba(198, 199, 203, 0.20), 0px -1px 10px 0px rgba(198, 199, 203, 0.20); margin: 10px; @@ -2389,7 +2400,9 @@ button#send_feedback_form{ width: 48%; height: 322px; border-radius: 10px; - background: #272424; + background: url(/static/img/png/cards_item_4.png), #111217 50%; + background-repeat: no-repeat; + background-position: right; /* Shadow 1 */ box-shadow: -1px 4px 10px 0px rgba(198, 199, 203, 0.20), 0px -1px 10px 0px rgba(198, 199, 203, 0.20); @@ -2416,7 +2429,7 @@ button#send_feedback_form{ } .card_title_2{ color: #FFF; - font-size: 20px; + font-size: 24px; font-style: normal; font-weight: 700; line-height: 36px; /* 150% */ @@ -2424,12 +2437,12 @@ button#send_feedback_form{ } .card_title_3{ color: #FFF; - font-size: 13px; + font-size: 16px; font-style: normal; font-weight: 400; line-height: 22px; margin: 20px 0 0 20px; - width: 80%; + width: 50%; } /*faq_main_page*/ @@ -2685,6 +2698,44 @@ details[open] summary ~ *{ /*media breakpoints*/ @media (max-width: 320px) { + + 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; + } + + .top_block_static_wrapper_main{ + background: unset; + } .header_big_background { max-width: 100%; } @@ -2711,6 +2762,10 @@ details[open] summary ~ *{ } #title_static{ font-size: 34px; + line-height: 42px; + } + .cards_wrapper{ + flex-direction: column; } .cards_item_1, @@ -2722,6 +2777,67 @@ details[open] summary ~ *{ 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) { diff --git a/static/img/svg/LogoMobile.svg b/static/img/svg/LogoMobile.svg new file mode 100644 index 0000000..a963adb --- /dev/null +++ b/static/img/svg/LogoMobile.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/static/img/svg/userMobile.svg b/static/img/svg/userMobile.svg new file mode 100644 index 0000000..7506349 --- /dev/null +++ b/static/img/svg/userMobile.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/templates/blocks/b_header.html b/templates/blocks/b_header.html index 7dd042f..e4b86d2 100644 --- a/templates/blocks/b_header.html +++ b/templates/blocks/b_header.html @@ -2,31 +2,42 @@ {% load base_tags_extra %}
-
-
-
+
-
+
-
+ @@ -57,6 +68,10 @@
+
+ +
+