adaptive600
This commit is contained in:
parent
27c4b051ff
commit
91a1ecf072
54
index.html
54
index.html
@ -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">
|
||||
Вы выбираете, что хотите приготовить — Hvatilo <br>
|
||||
Вы выбираете, что хотите приготовить — <br class="big medium small"> Hvatilo
|
||||
помогает собрать остальное
|
||||
</p>
|
||||
<div id="page_how_it_works_steps">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user