Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

сдача #11

Merged
merged 1 commit into from
Feb 23, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
36 changes: 21 additions & 15 deletions source/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -59,14 +59,16 @@ <h2 class="visually-hidden">Выбор цели питания для котик
<ul class="goals__list">
<li class="goals__item goals__item--slim">
<h3 class="goals__title">Похудение</h3>
<p class="goals__text">Ваш кот весит больше собаки и почти утратил способность лазить по деревьям? Пора на диету! Cat Energy Slim поможет вашему питомцу сбросить лишний вес.Ваш кот весит больше собаки и почти утратил способность лазить по деревьям? Пора на диету! Cat Energy Slim поможет вашему питомцу сбросить лишний вес.</p>
<p class="goals__text">Ваш кот весит больше собаки и почти утратил способность лазить по деревьям? Пора на
диету! Cat Energy Slim поможет вашему питомцу сбросить лишний вес.</p>
<a class="link goals__link" href="#">
<span class="goals__point">Каталог slim</span>
</a>
</li>
<li class="goals__item goals__item--pro">
<h3 class="goals__title">Набор массы</h3>
<p class="goals__text">Заработать авторитет среди дворовых котов и даже собак? Серия Cat Energy Pro поможет вашему коту нарастить необходимые мышцы!
<p class="goals__text">Заработать авторитет среди дворовых котов и даже собак? Серия Cat Energy Pro поможет
вашему коту нарастить необходимые мышцы!
</p>
<a class="link goals__link" href="#">
<span class="goals__point">Каталог pro</span>
Expand Down Expand Up @@ -96,19 +98,23 @@ <h2 class="description__title">
<span class="description__title-text">Живой пример</span>
</h2>
<div class="description__wrapper">
<p class="description__text">Борис сбросил 5 кг за 2 месяца, просто заменив свой обычный корм на Cat Energy Slim. Отличный результат без&nbsp;изнуряющих тренировок! При этом он не менял своих привычек и по-прежнему спит по 16 часов в день.</p>
<div class="description__container">
<ul class="description__results">
<li class="description__result result">
<span class="result__title">5 кг</span>
<span class="result__text">снижение веса</span>
</li>
<li class="description__result result">
<span class="result__title">60 дней</span>
<span class="result__text">затрачено времени</span>
</li>
</ul>
<p class="description__cost">Затраты на питание: <span class="description__sum">15 000 руб.</span></p>
<div class="description__block">
<p class="description__text">Борис сбросил 5 кг за 2 месяца, просто заменив свой обычный корм на Cat Energy
Slim. Отличный результат без&nbsp;изнуряющих тренировок! При этом он не менял своих привычек и по-прежнему
спит по 16 часов в день.</p>
<div class="description__container">
<ul class="description__results">
<li class="description__result result">
<span class="result__title">5 кг</span>
<span class="result__text">снижение веса</span>
</li>
<li class="description__result result">
<span class="result__title">60 дней</span>
<span class="result__text">затрачено времени</span>
</li>
</ul>
<p class="description__cost">Затраты на питание: <span class="description__sum">15 000 руб.</span></p>
</div>
</div>
<div class="slider">
<div class="slider__container">
Expand Down
6 changes: 3 additions & 3 deletions source/styles/blocks/addition.scss
Original file line number Diff line number Diff line change
Expand Up @@ -94,7 +94,7 @@

.addition__item {
border: 1px solid #cdcdcd;
padding: 27px 31px 27px 37px;
padding: 27px 38px 27px 37px;
border-bottom: none;
margin: 0;
}
Expand Down Expand Up @@ -129,7 +129,7 @@

@media (min-width: $desktop) {
.addition {
padding-top: 70px;
padding-top: 68px;
}

.addition__header {
Expand All @@ -149,7 +149,7 @@
display: grid;
grid-template-columns: 1fr 245px;
gap: 80px;
margin: 49px auto 76px;
margin: 47px auto 78px;
}

.addition__container {
Expand Down
22 changes: 13 additions & 9 deletions source/styles/blocks/advantages.scss
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
font-size: 36px;
line-height: 40px;
text-align: left;
margin: 0 0 42px;
margin: 0 0 40px;
padding: 0;
}

Expand Down Expand Up @@ -82,7 +82,7 @@
border-bottom: 1px solid #e6e6e6;
width: 100%;
margin: 0;
padding: 0 0 27px;
padding: 0 0 160px;
}

.advantages__title {
Expand All @@ -91,16 +91,16 @@
line-height: 60px;
text-align: left;
padding: 0;
margin-bottom: 32px;
margin-bottom: 34px;
margin-top: 47px;
margin-left: 30px;
}

.advantages__list {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 84px 64px;
padding: 32px 30px;
gap: 215px 60px;
padding: 30px;
}

.advantages__item {
Expand Down Expand Up @@ -157,8 +157,8 @@
text-align: left;
color: #444444;
width: 250px;
bottom: 43px;
padding: 162px 0 0;
top: 88px;
padding: 30px 0 0;
}
}

Expand All @@ -170,11 +170,11 @@
}

.advantages__title {
margin: 74px 0 32px;
margin: 72px 0 32px;
}

.advantages__list {
grid-template-columns: (250px 250px 250px 250px);
grid-template-columns: 250px 250px 250px 250px;
column-gap: 75px;
margin: 0 auto;
display: grid;
Expand All @@ -187,4 +187,8 @@
right: 0;
}
}

.advantages__text {
top: 90px;
}
}
17 changes: 13 additions & 4 deletions source/styles/blocks/description.scss
Original file line number Diff line number Diff line change
Expand Up @@ -120,32 +120,42 @@
margin: 0 auto;
position: relative;
z-index: 5;
padding-top: 71px;
padding-top: 69px;
display: flex;
}

.description__block {
display: flex;
flex-direction: column;
padding: 0;
margin: 0;
}

.description__title {
margin: 0;
position: relative;
padding: 23px 111px 76px;
padding: 23px 111px 77px;
background-color: #ffffff;
}

.description__title-text {
width: 1220px;
margin: 0 auto;
display: block;
padding-top: 3px;
}

.description__text {
width: 436px;
padding: 0 266px 69px 0;
padding: 0 266px 19px 0;
box-sizing: border-box;
margin: 0;
}

.description__container {
display: block;
margin: 0;
padding-top: 50px;
}

.description__results {
Expand All @@ -161,7 +171,6 @@
justify-content: space-between;
}


.description__sum {
padding: 0;
}
Expand Down
8 changes: 5 additions & 3 deletions source/styles/blocks/footer.scss
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@
.footer__elements {
background-color: #f2f2f2;
position: relative;
padding: 40px 20px;
padding: 41px 20px;
bottom: 0;
}

Expand Down Expand Up @@ -109,7 +109,7 @@
}

.footer__link {
padding-right: 17px;
padding-right: 22px;
}
}

Expand All @@ -121,7 +121,7 @@
.footer__elements {
width: 1220px;
margin: 0 auto;
padding: 64px 0;
padding: 62px 0;
align-items: center;
}

Expand All @@ -132,6 +132,7 @@

.footer__logo {
text-align: left;
padding-top: 2px;
}

.footer__developer {
Expand All @@ -142,6 +143,7 @@
.footer__link {
margin: 0;
padding-top: 0;
padding-right: 24px;
}

.footer__words {
Expand Down
37 changes: 24 additions & 13 deletions source/styles/blocks/goals.scss
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
background-image: url("../../images/cat-pro.svg");
width: 67px;
height: 28px;
top: 37px;
top: 36px;
left: 13px;
}

Expand Down Expand Up @@ -87,13 +87,14 @@
padding-right: 65px;
display: inline-block;
min-width: 150px;
bottom: 15px;

&::after {
content: "";
width: 24px;
height: 10px;
position: absolute;
left: calc(100% - 49px);
left: calc(100% - 115px);
background: url("../../images/arrow-goals.svg") no-repeat right top;
top: 2px;
transition: width 0.3s ease;
Expand All @@ -117,13 +118,16 @@

@media (min-width: $tablet) {
.goals__list {
margin: 0;
margin: 0 30px;
padding: 0;
display: flex;
flex-flow: column wrap;
gap: 32px;
}

.goals__item {
margin: 0 30px 32px;
padding: 75px 63px 53px 53px;
margin: 0;
padding: 79px 53px 112px;
position: relative;

&::before {
Expand All @@ -133,17 +137,17 @@
border-radius: 50%;
background: $green;
position: absolute;
top: 91px;
top: 93px;
left: 100%;
margin-left: -265px;
margin-left: -263px;
z-index: 1;
}
}

.goals__item--slim::after {
top: 79px;
top: 83px;
left: 100%;
margin-left: -235px;
margin-left: -233px;
width: 140px;
height: 194px;
}
Expand All @@ -152,7 +156,7 @@
width: 268px;
height: 112px;
left: 100%;
margin-left: -295px;
margin-left: -293px;
top: 136px;
}

Expand All @@ -162,7 +166,7 @@
line-height: 36px;
text-align: left;
margin: 0;
padding: 2px 200px 24px 0;
padding: 0;
padding-bottom: 24px;
}

Expand All @@ -176,7 +180,6 @@
margin: 0;
padding: 0;
width: 340px;
padding-bottom: 53px;
}

.goals__link {
Expand All @@ -185,6 +188,7 @@
line-height: 30px;
text-align: left;
box-sizing: border-box;
top: 33px;
}

.goals__link::after {
Expand All @@ -209,10 +213,12 @@

.goals__item {
margin: 0;
padding: 77px 61px 55px 52px;
padding: 77px 61px 88px 52px;
box-sizing: border-box;
position: relative;
width: 570px;
display: flex;
flex-direction: column;

&::before {
width: 100px;
Expand Down Expand Up @@ -246,5 +252,10 @@
.goals__text {
width: 455px;
padding: 0 0 28px;
flex-grow: 1;
}

.goals__link {
top: 0;
}
}
Loading