Skip to content
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
13 changes: 7 additions & 6 deletions source/catalog.html
Original file line number Diff line number Diff line change
Expand Up @@ -35,8 +35,9 @@
<img class="logo__text" src="images/logo-text-mobile.svg" width="101" height="18" alt="Cat energy">
</picture>
</a>
<nav class="main-header__nav main-nav">
<!-- Если JS выключен - модификатор nojs к main-nav -->
<nav class="main-header__nav main-nav main-nav--js">
<!-- Если нужно интерактивное меню - модификатор js к main-nav -->
<!-- Если нужно открытое меню - модификатор nojs к main-nav -->
<input class="main-nav__input visually-hidden" type="checkbox" id="main-nav-input" name="main-nav-input">
<label class="main-nav__toggle" for="main-nav-input"></label>
<ul class="main-nav__list">
Expand Down Expand Up @@ -359,12 +360,12 @@ <h2 class="contacts__title">Приглашаем
</div>
<!-- Если JS включен - js -->
<!-- Если JS выключен - nojs -->
<div class="main-footer__map main-footer__map--js">
<div class="main-footer__map main-footer__map--nojs">
<iframe class="main-footer__map-iframe" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1998.6037876728562!2d30.320472478050274!3d59.93871647491518!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x4696310fca3de3a1%3A0xc7af30764648c6b1!2z0JHQvtC70YzRiNCw0Y8g0JrQvtC90Y7RiNC10L3QvdCw0Y8g0YPQuy4sINC0LiAxOS84LCDQodCw0L3QutGCLdCf0LXRgtC10YDQsdGD0YDQsywgMTkxMTg2!5e0!3m2!1sru!2sru!4v1766597941287!5m2!1sru!2sru" width="320" height="362" allowfullscreen title="Офис компании по адресу ул.Большая Конюшенная, 19/8, Санкт-Петербург" loading="lazy"></iframe>
<picture class="main-footer__map-picture">
<source type="image/webp" media="(min-width: 1200px)" srcset="images/map-desktop@1x.webp 1x, images/map-desktop@2x.webp 2x">
<source type="image/webp" media="(min-width: 768px)" srcset="images/map-tablet@1x.webp 1x, images/map-tablet@2x.webp 2x">
<source type="image/webp" srcset="images/map-mobile@1x.webp 1x, images/map-mobile@2x.webp 2x">
<source width="1440" height="400" type="image/webp" media="(min-width: 1200px)" srcset="images/map-desktop@1x.webp 1x, images/map-desktop@2x.webp 2x">
<source width="768" height="400" type="image/webp" media="(min-width: 768px)" srcset="images/map-tablet@1x.webp 1x, images/map-tablet@2x.webp 2x">
<source width="320" height="362" type="image/webp" srcset="images/map-mobile@1x.webp 1x, images/map-mobile@2x.webp 2x">

<source width="1440" height="400" type="image/png" media="(min-width: 1340px)" srcset="images/map-desktop@1x.png 1x, images/map-desktop@2x.png 2x">
<source width="768" height="400" type="image/png" media="(min-width: 768px)" srcset="images/map-tablet@1x.png 1x, images/map-tablet@2x.png 2x">
Expand Down
19 changes: 10 additions & 9 deletions source/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -35,8 +35,9 @@
<img class="logo__text" src="images/logo-text-mobile.svg" width="101" height="18" alt="Cat energy">
</picture>
</a>
<nav class="main-header__nav main-nav">
<!-- Если JS выключен - модификатор nojs к main-nav -->
<nav class="main-header__nav main-nav main-nav--js">
<!-- Если нужно интерактивное меню - модификатор js к main-nav -->
<!-- Если нужно открытое меню - модификатор nojs к main-nav -->
<input class="main-nav__input visually-hidden" type="checkbox" id="main-nav-input" name="main-nav-input">
<label class="main-nav__toggle" for="main-nav-input"></label>
<ul class="main-nav__list main-nav__list--bg">
Expand Down Expand Up @@ -68,9 +69,9 @@ <h1 class="nutrition-selector__title">Функциональное
<p class="nutrition-selector__description">Занялся собой? Займись котом!</p>
</div>
<picture class="nutrition-selector__image-container">
<source type="image/webp" media="(min-width: 1200px)" srcset="images/promo-food-desktop@1x.webp 1x, images/promo-food-desktop@2x.webp 2x">
<source type="image/webp" media="(min-width: 768px)" srcset="images/promo-food-tablet@1x.webp 1x, images/promo-food-tablet@2x.webp 2x">
<source type="image/webp" srcset="images/promo-food-mobile@1x.webp 1x, images/promo-food-mobile@2x.webp 2x">
<source width="552" height="499" type="image/webp" media="(min-width: 1200px)" srcset="images/promo-food-desktop@1x.webp 1x, images/promo-food-desktop@2x.webp 2x">
<source width="709" height="609" type="image/webp" media="(min-width: 768px)" srcset="images/promo-food-tablet@1x.webp 1x, images/promo-food-tablet@2x.webp 2x">
<source width="280" height="270" type="image/webp" srcset="images/promo-food-mobile@1x.webp 1x, images/promo-food-mobile@2x.webp 2x">
<source width="552" height="499" type="image/png" media="(min-width: 1340px)" srcset="images/promo-food-desktop@1x.png 1x, images/promo-food-desktop@2x.png 2x">
<source width="709" height="609" type="image/png" media="(min-width: 768px)" srcset="images/promo-food-tablet@1x.png 1x, images/promo-food-tablet@2x.png 2x">
<img class="nutrition-selector__image" src="images/promo-food-mobile@1x.png" srcset="images/promo-food-mobile@2x.png 2x" width="280" height="270" alt="Упаковка фирменного корма Cat Energy">
Expand Down Expand Up @@ -176,12 +177,12 @@ <h2 class="contacts__title">Приглашаем
</div>
<!-- Если JS включен - js -->
<!-- Если JS выключен - nojs -->
<div class="main-footer__map main-footer__map--js">
<div class="main-footer__map main-footer__map--nojs">
<iframe class="main-footer__map-iframe" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1998.6037876728562!2d30.320472478050274!3d59.93871647491518!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x4696310fca3de3a1%3A0xc7af30764648c6b1!2z0JHQvtC70YzRiNCw0Y8g0JrQvtC90Y7RiNC10L3QvdCw0Y8g0YPQuy4sINC0LiAxOS84LCDQodCw0L3QutGCLdCf0LXRgtC10YDQsdGD0YDQsywgMTkxMTg2!5e0!3m2!1sru!2sru!4v1766597941287!5m2!1sru!2sru" width="320" height="362" allowfullscreen title="Офис компании по адресу ул.Большая Конюшенная, 19/8, Санкт-Петербург" loading="lazy"></iframe>
<picture class="main-footer__map-picture">
<source type="image/webp" media="(min-width: 1200px)" srcset="images/map-desktop@1x.webp 1x, images/map-desktop@2x.webp 2x">
<source type="image/webp" media="(min-width: 768px)" srcset="images/map-tablet@1x.webp 1x, images/map-tablet@2x.webp 2x">
<source type="image/webp" srcset="images/map-mobile@1x.webp 1x, images/map-mobile@2x.webp 2x">
<source width="1440" height="400" type="image/webp" media="(min-width: 1200px)" srcset="images/map-desktop@1x.webp 1x, images/map-desktop@2x.webp 2x">
<source width="768" height="400" type="image/webp" media="(min-width: 768px)" srcset="images/map-tablet@1x.webp 1x, images/map-tablet@2x.webp 2x">
<source width="320" height="362" type="image/webp" srcset="images/map-mobile@1x.webp 1x, images/map-mobile@2x.webp 2x">
<source width="1440" height="400" type="image/png" media="(min-width: 1340px)" srcset="images/map-desktop@1x.png 1x, images/map-desktop@2x.png 2x">
<source width="768" height="400" type="image/png" media="(min-width: 768px)" srcset="images/map-tablet@1x.png 1x, images/map-tablet@2x.png 2x">
<img class="main-footer__map-image" src="images/map-mobile@1x.png" srcset="images/map-mobile@2x.png 2x" width="320" height="362" alt="Офис компании по адресу ул.Большая Конюшенная, 19/8, Санкт-Петербург">
Expand Down
13 changes: 11 additions & 2 deletions source/styles/blocks/advertising-example.scss
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,12 @@
}
}

@media (min-width: $desktop-width) {
.advertising-example {
background-image: linear-gradient(#ffffff 195px, #f2f2f2 195px 100%);
}
}

@media (min-width: $tablet-width) {
.advertising-example__container {
display: flex;
Expand All @@ -38,7 +44,7 @@
min-width: 280px;
max-width: 280px;
margin: 0 auto;
padding: 25px 20px 50px;
padding: 25px 20px 40px;
}

@media (min-width: $tablet-width) {
Expand All @@ -60,7 +66,6 @@
}
}


.advertising-example__title {
@include font-text-secondary(36px, 40px, $color-text-dark);
margin: 0;
Expand Down Expand Up @@ -172,5 +177,9 @@
margin: 0;
margin-bottom: 85px;
margin-right: 60px;

position: absolute;
top: 72px;
right: 0;
}
}
2 changes: 1 addition & 1 deletion source/styles/blocks/links.scss
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
min-width: 280px;
max-width: 280px;
margin: 0 auto;
padding: 50px 20px;
padding: 40px 20px;
}

@media (min-width: $tablet-width) {
Expand Down
8 changes: 7 additions & 1 deletion source/styles/blocks/main-footer.scss
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,12 @@
overflow: hidden;
}

@media (min-width: $tablet-width) {
.main-footer__map-picture {
max-height: 400px;
}
}

.main-footer__map-image {
display: block;
width: 100%;
Expand Down Expand Up @@ -82,7 +88,7 @@

.main-footer__contacts {
margin: 0 auto;
padding: 15px 20px;
padding: 25px 20px;
}

@media (min-width: $tablet-width) {
Expand Down
3 changes: 2 additions & 1 deletion source/styles/blocks/main.scss
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
@media (min-width: $tablet-width) {
.main__nutrition-selector {
margin: 0 auto;
padding: 65px 30px 0;
padding: 65px 0 0;
}
}

Expand Down Expand Up @@ -87,6 +87,7 @@
.main__promos-and-new {
margin: 0 auto;
padding: 45px 20px;
padding-bottom: 35px;
}

@media (width >= 768px) {
Expand Down
6 changes: 3 additions & 3 deletions source/styles/blocks/nutrition-selector.scss
Original file line number Diff line number Diff line change
Expand Up @@ -59,8 +59,6 @@

@media (min-width: $tablet-width) {
.nutrition-selector {
min-width: 708px;
max-width: 708px;
background: none;
}

Expand All @@ -78,7 +76,7 @@
min-width: 708px;
max-width: 708px;
margin: 0 auto;
padding: 0;
padding: 0 30px;
position: relative;
}
}
Expand Down Expand Up @@ -233,13 +231,15 @@
.nutrition-selector__image-container {
grid-row: 2/4;
grid-column: 1/-1;
margin-left: 20px;
}
}

@media (min-width: $desktop-width) {
.nutrition-selector__image-container {
grid-column: 4/6;
grid-row: 1/4;
margin-left: 0;
}
}

Expand Down
1 change: 1 addition & 0 deletions source/styles/blocks/offer-list.scss
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
.offer-list {
display: flex;
gap: 80px;
flex-wrap: wrap;
}
}

Expand Down
8 changes: 4 additions & 4 deletions source/styles/blocks/product-card.scss
Original file line number Diff line number Diff line change
Expand Up @@ -48,9 +48,9 @@
flex-direction: column;
background:
linear-gradient(
to top,
$bg-color-base 0% 430px,
transparent 430px 100%
to bottom,
transparent 0% 81px,
$bg-color-base 81px 100%
);
background-repeat: no-repeat;
background-position: center;
Expand Down Expand Up @@ -83,7 +83,7 @@
content: "";
position: absolute;
width: 100%;
height: 429px;
height: calc(100% - 81px);
bottom: 0;
left: 0;
border: 2px solid #f2f2f2;
Expand Down