adaptive600

This commit is contained in:
Zakhar 2026-06-18 19:49:27 +03:00
parent 27c4b051ff
commit 91a1ecf072

View File

@ -98,6 +98,7 @@
#bottom_contacts_small {display: none;}
br.small {display: none;}
br.medium {display: none;}
br.big {display: initial;}
@media (max-width: 1360px){
@ -148,22 +149,51 @@
#page_footer {padding-left: 40px;padding-right: 20px;}
}
@media (max-width: 600px){
.big_index_greeting {font-size: 104px;line-height: 105px;}
br.big {display: none;}
br.medium {display: initial !important;}
#page_index {height: 100vh;padding-top: 0;}
.big_index_greeting {font-size: 85px;line-height: 81px;text-align: left;max-width: 80%;margin: 0 20px;}
.big_index_greeting:last-child {text-align: right;}
#page_index p {font-size: 24px;text-align: center}
#page_index_content {width: 100%;max-width: 480px;}
#page_index_content h1 + div {flex-direction: column-reverse;}
#page_index_content h1 + div div {width: 100%;}
#page_index_store_btns {justify-content: center;}
#page_meal_plan_content_description {gap: 30px;}
#page_meal_plan_content {gap: 0;}
#page_meal_plan_broc_small {display: block;border-radius: 24px;}
#page_autobasket_content_description p {font-size: 22px;padding: 0 15px;}
#page_autobasket_images {flex-direction: column;}
#page_autobasket_images p {font-size: 20px;}
#page_autobasket_images div {max-width: 100% !important;}
#page_autobasket_images > div {flex-direction: row;}
#page_autobasket_images div img {max-width: 50% !important;}
#page_autobasket_images > div > img {max-width: 50% !important;}
h3 {font-size: 22px;}
.autobasket_image_wrapper img {max-width: 100% !important;}
#page_how_it_works_info {height: 280px;}
#page_how_it_works_info_image img {max-width: 220px;}
#page_how_it_works_step_3 img { max-width: 120px !important;max-height: 120px !important;}
#page_how_it_works_step_3 {width: 100%;align-items: center;}
#page_how_it_works_step_3 p {width: 100%;}
#page_how_it_works_info_content {margin-left: 100px;color:#0C3B2E;}
#page_footer {margin-top: 60px;}
#page_footer > div {flex-direction: column;align-items: flex-start;padding-left:10px;gap: 16px;}
#page_footer > div {font-size: 14px;}
#page_footer a {color:#6d8982;}
#bottom_logo {margin-bottom: 32px;}
#bottom_contacts_header {font-weight: bold;margin-bottom: 4px;}
#bottom_contacts_header {font-size:14px;}
#bottom_contacts {margin-bottom: 8px;}
#bottom_contacts_big {display: none;}
#bottom_contacts_small {display: flex;color:#6d8982;padding-bottom: 80px;}
}
@media (max-width: 420px){
br.small {display: initial !important;}
br.big {display: none;}
#page_index_content {padding-top:0;width: 100%;}
.big_index_greeting {font-size: 65px;line-height: 61px;text-align: left;max-width: 80%;margin: 0 20px;}
.big_index_greeting:last-child {text-align: right;}
@ -171,18 +201,16 @@
#top_line {padding:10px 20px;height:52px;}
#top_logo span {display: none;}
h2 {font-size: 32px;}
#page_meal_plan_content {gap: 0;}
#page_meal_plan_content_description {max-width: 100%;min-width: 320px;}
#page_meal_plan_content_description h2 {text-align: center;}
#page_how_it_works_content {padding: 0 20px;box-sizing: border-box;}
#try_button {font-size: 12px;padding:8.5px 35.5px;}
p.text_secondary {margin: 0;}
#page_index {height: 100vh;padding-top: 0;}
#page_autobasket_images > div {flex-direction: column;}
#page_autobasket_images div img {max-width: 100% !important;}
#page_autobasket_content_description p {font-size: 16px;}
#page_meal_plan_broc_small {display: block;border-radius: 24px;}
p.description_large {font-size: 16px;}
#page_how_it_works_info {height: auto;}
#page_how_it_works_steps {font-size: 14px;padding:0;align-items: initial;margin-top: 20px;}
#page_how_it_works_steps p {display: flex;align-content: center;align-items: center;width: 100%;justify-content: center;}
#page_how_it_works_steps > div {width: 100%;}
@ -193,14 +221,8 @@
#page_how_it_works_info_image {height: auto;margin-top: -15px;margin-bottom: 20px; }
#page_how_it_works_info_image img {position: relative;top:initial;left:initial;}
#page_footer {margin-top: 60px;}
#page_footer > div {flex-direction: column;align-items: flex-start;padding-left:10px;font-size:12px;gap: 16px;}
#page_footer a {color:#6d8982;}
#bottom_logo {margin-bottom: 32px;}
#bottom_contacts_header {font-weight: bold;font-size:12px;margin-bottom: 4px;}
#bottom_contacts {margin-bottom: 8px;}
#bottom_contacts_big {display: none;}
#bottom_contacts_small {display: flex;color:#6d8982;padding-bottom: 80px;}
#page_footer > div {font-size: 12px;}
#bottom_contacts_header {font-size:12px;}
}
@media (max-height: 1000px){
@ -237,7 +259,7 @@
<div class="container_row">
<div>
<p class="text_secondary">
Персональный помощник <br> по питанию: баланс, <br class="big"> энергия,<br class="small"> порядок <br class="big">в холодильнике - <br> для всей семьи
Персональный помощник <br> по питанию: баланс, <br class="big"> энергия,<br class="small medium"> порядок <br class="big">в холодильнике - <br> для всей семьи
</p>
</div>
<div class="big_index_greeting">гадать</div>
@ -320,7 +342,7 @@
<br>
<br class="big">
<p class="description_large">
Вы выбираете, что хотите приготовить &mdash; Hvatilo <br>
Вы выбираете, что хотите приготовить &mdash; <br class="big medium small"> Hvatilo
помогает собрать остальное
</p>
<div id="page_how_it_works_steps">