diff --git a/Readme.md b/Readme.md index 05eac74..480bd34 100644 --- a/Readme.md +++ b/Readme.md @@ -1,7 +1,7 @@ # Личный проект «Кэт энерджи» * Студент: [Олег Сулицкий](https://up.htmlacademy.ru/adaptive-individual/2/user/2549447). -* Наставник: `Неизвестно`. +* Наставник: [Анна Лисененкова](https://htmlacademy.ru/profile/ankhena). --- diff --git a/source/404.html b/source/404.html index 1000888..c6bca91 100644 --- a/source/404.html +++ b/source/404.html @@ -1,14 +1,17 @@ - - - 404 - - - - - -

404

-

Страница не найдена. Перейти на главную.

- + + + + 404 + + + + + + +

404

+

Страница не найдена. Перейти на главную.

+ + diff --git a/source/catalog.html b/source/catalog.html new file mode 100644 index 0000000..6061834 --- /dev/null +++ b/source/catalog.html @@ -0,0 +1,361 @@ + + + + + + Каталог продукции Cat Energy + + + + + + + + + + + + +
+ + + + + Логотип Cat Energy + + + + Текстовый вариант логотипа Cat Energy + + + +
+
+
+
+

Каталог продукции

+
+ +
+
+
+
+

Дополнительные товары

+
+
    +
  • +

    Сахарозаменитель

    +
    +
    Тара
    +
    1 упаковка (100 г)
    +
    Цена
    +
    200 ₽
    +
    + +
  • +
  • +

    Питьевая вода

    +
    +
    Тара
    +
    5 литров
    +
    Цена
    +
    50 ₽
    +
    + +
  • +
  • +

    Молоко

    +
    +
    Тара
    +
    1 литр
    +
    Цена
    +
    100 ₽
    +
    + +
  • +
  • +

    Витамины

    +
    +
    Тара
    +
    1 упаковка (30 г)
    +
    Цена
    +
    300 ₽
    +
    + +
  • +
+
+

Закажите все и получите чехол для кота в подарок!

+
+
+
+
+ + + +
+
+
+

Приглашаем к сотрудничеству дилеров!

+
+

ул. Большая Конюшенная, д. 19/8

+

Санкт-Петербург

+
+
+
+ + + + + + + Карта с отмеченной локацией магазина Cat Energy + + +
+
+
+ + + + diff --git a/source/favicon.ico b/source/favicon.ico new file mode 100644 index 0000000..6f46f67 Binary files /dev/null and b/source/favicon.ico differ diff --git a/source/favicons/180.png b/source/favicons/180.png new file mode 100644 index 0000000..40a65ce Binary files /dev/null and b/source/favicons/180.png differ diff --git a/source/favicons/192.png b/source/favicons/192.png new file mode 100644 index 0000000..cac9fb6 Binary files /dev/null and b/source/favicons/192.png differ diff --git a/source/favicons/512.png b/source/favicons/512.png new file mode 100644 index 0000000..8298702 Binary files /dev/null and b/source/favicons/512.png differ diff --git a/source/favicons/icon.svg b/source/favicons/icon.svg new file mode 100644 index 0000000..07ed730 --- /dev/null +++ b/source/favicons/icon.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/source/icons/button-cross.svg b/source/icons/button-cross.svg new file mode 100644 index 0000000..d432f44 --- /dev/null +++ b/source/icons/button-cross.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/button-slider.svg b/source/icons/button-slider.svg new file mode 100644 index 0000000..5fa9af8 --- /dev/null +++ b/source/icons/button-slider.svg @@ -0,0 +1 @@ + diff --git a/source/icons/button-toggle.svg b/source/icons/button-toggle.svg new file mode 100644 index 0000000..69be46b --- /dev/null +++ b/source/icons/button-toggle.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/icon-arrow-right.svg b/source/icons/icon-arrow-right.svg new file mode 100644 index 0000000..b25c0b6 --- /dev/null +++ b/source/icons/icon-arrow-right.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/icon-benefit.svg b/source/icons/icon-benefit.svg new file mode 100644 index 0000000..0b5fe1c --- /dev/null +++ b/source/icons/icon-benefit.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/icon-cat-pro.svg b/source/icons/icon-cat-pro.svg new file mode 100644 index 0000000..b945c56 --- /dev/null +++ b/source/icons/icon-cat-pro.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/icon-cat-slim.svg b/source/icons/icon-cat-slim.svg new file mode 100644 index 0000000..1145925 --- /dev/null +++ b/source/icons/icon-cat-slim.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/icon-change.svg b/source/icons/icon-change.svg new file mode 100644 index 0000000..d2bc6dc --- /dev/null +++ b/source/icons/icon-change.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/icon-htmlacademy.svg b/source/icons/icon-htmlacademy.svg new file mode 100644 index 0000000..8f46539 --- /dev/null +++ b/source/icons/icon-htmlacademy.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/icon-improvement.svg b/source/icons/icon-improvement.svg new file mode 100644 index 0000000..762acdc --- /dev/null +++ b/source/icons/icon-improvement.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/icon-plus.svg b/source/icons/icon-plus.svg new file mode 100644 index 0000000..328b41a --- /dev/null +++ b/source/icons/icon-plus.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/icon-promo-gift.svg b/source/icons/icon-promo-gift.svg new file mode 100644 index 0000000..f6befb1 --- /dev/null +++ b/source/icons/icon-promo-gift.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/icon-telegram.svg b/source/icons/icon-telegram.svg new file mode 100644 index 0000000..f953854 --- /dev/null +++ b/source/icons/icon-telegram.svg @@ -0,0 +1 @@ + diff --git a/source/icons/icon-usability.svg b/source/icons/icon-usability.svg new file mode 100644 index 0000000..e4568f1 --- /dev/null +++ b/source/icons/icon-usability.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/icon-vkontakte.svg b/source/icons/icon-vkontakte.svg new file mode 100644 index 0000000..8eff6a3 --- /dev/null +++ b/source/icons/icon-vkontakte.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/icon-youtube.svg b/source/icons/icon-youtube.svg new file mode 100644 index 0000000..8506734 --- /dev/null +++ b/source/icons/icon-youtube.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/images/bg-promo-desktop@1x.jpg b/source/images/bg-promo-desktop@1x.jpg new file mode 100644 index 0000000..ca8a4c4 Binary files /dev/null and b/source/images/bg-promo-desktop@1x.jpg differ diff --git a/source/images/bg-promo-desktop@1x.webp b/source/images/bg-promo-desktop@1x.webp new file mode 100644 index 0000000..8763933 Binary files /dev/null and b/source/images/bg-promo-desktop@1x.webp differ diff --git a/source/images/bg-promo-desktop@2x.jpg b/source/images/bg-promo-desktop@2x.jpg new file mode 100644 index 0000000..209657f Binary files /dev/null and b/source/images/bg-promo-desktop@2x.jpg differ diff --git a/source/images/bg-promo-desktop@2x.webp b/source/images/bg-promo-desktop@2x.webp new file mode 100644 index 0000000..494cd29 Binary files /dev/null and b/source/images/bg-promo-desktop@2x.webp differ diff --git a/source/images/bg-promo-mobile@1x.jpg b/source/images/bg-promo-mobile@1x.jpg new file mode 100644 index 0000000..a1111b0 Binary files /dev/null and b/source/images/bg-promo-mobile@1x.jpg differ diff --git a/source/images/bg-promo-mobile@1x.webp b/source/images/bg-promo-mobile@1x.webp new file mode 100644 index 0000000..db13b8d Binary files /dev/null and b/source/images/bg-promo-mobile@1x.webp differ diff --git a/source/images/bg-promo-mobile@2x.jpg b/source/images/bg-promo-mobile@2x.jpg new file mode 100644 index 0000000..0b87f14 Binary files /dev/null and b/source/images/bg-promo-mobile@2x.jpg differ diff --git a/source/images/bg-promo-mobile@2x.webp b/source/images/bg-promo-mobile@2x.webp new file mode 100644 index 0000000..eb72243 Binary files /dev/null and b/source/images/bg-promo-mobile@2x.webp differ diff --git a/source/images/bg-promo-tablet@1x.jpg b/source/images/bg-promo-tablet@1x.jpg new file mode 100644 index 0000000..ebafe2f Binary files /dev/null and b/source/images/bg-promo-tablet@1x.jpg differ diff --git a/source/images/bg-promo-tablet@1x.webp b/source/images/bg-promo-tablet@1x.webp new file mode 100644 index 0000000..cdbcaec Binary files /dev/null and b/source/images/bg-promo-tablet@1x.webp differ diff --git a/source/images/bg-promo-tablet@2x.jpg b/source/images/bg-promo-tablet@2x.jpg new file mode 100644 index 0000000..f0f5c2e Binary files /dev/null and b/source/images/bg-promo-tablet@2x.jpg differ diff --git a/source/images/bg-promo-tablet@2x.webp b/source/images/bg-promo-tablet@2x.webp new file mode 100644 index 0000000..bfb018f Binary files /dev/null and b/source/images/bg-promo-tablet@2x.webp differ diff --git a/source/images/ce-buckwheat-slim1000-desktop@1x.png b/source/images/ce-buckwheat-slim1000-desktop@1x.png new file mode 100644 index 0000000..e5a60bd Binary files /dev/null and b/source/images/ce-buckwheat-slim1000-desktop@1x.png differ diff --git a/source/images/ce-buckwheat-slim1000-desktop@1x.webp b/source/images/ce-buckwheat-slim1000-desktop@1x.webp new file mode 100644 index 0000000..c4d5659 Binary files /dev/null and b/source/images/ce-buckwheat-slim1000-desktop@1x.webp differ diff --git a/source/images/ce-buckwheat-slim1000-desktop@2x.png b/source/images/ce-buckwheat-slim1000-desktop@2x.png new file mode 100644 index 0000000..4ef8c94 Binary files /dev/null and b/source/images/ce-buckwheat-slim1000-desktop@2x.png differ diff --git a/source/images/ce-buckwheat-slim1000-desktop@2x.webp b/source/images/ce-buckwheat-slim1000-desktop@2x.webp new file mode 100644 index 0000000..76fd172 Binary files /dev/null and b/source/images/ce-buckwheat-slim1000-desktop@2x.webp differ diff --git a/source/images/ce-buckwheat-slim1000-mobile@1x.png b/source/images/ce-buckwheat-slim1000-mobile@1x.png new file mode 100644 index 0000000..92ca7e9 Binary files /dev/null and b/source/images/ce-buckwheat-slim1000-mobile@1x.png differ diff --git a/source/images/ce-buckwheat-slim1000-mobile@1x.webp b/source/images/ce-buckwheat-slim1000-mobile@1x.webp new file mode 100644 index 0000000..f59011f Binary files /dev/null and b/source/images/ce-buckwheat-slim1000-mobile@1x.webp differ diff --git a/source/images/ce-buckwheat-slim1000-mobile@2x.png b/source/images/ce-buckwheat-slim1000-mobile@2x.png new file mode 100644 index 0000000..c66bad0 Binary files /dev/null and b/source/images/ce-buckwheat-slim1000-mobile@2x.png differ diff --git a/source/images/ce-buckwheat-slim1000-mobile@2x.webp b/source/images/ce-buckwheat-slim1000-mobile@2x.webp new file mode 100644 index 0000000..baefc1f Binary files /dev/null and b/source/images/ce-buckwheat-slim1000-mobile@2x.webp differ diff --git a/source/images/ce-buckwheat-slim1000-tablet@1x.png b/source/images/ce-buckwheat-slim1000-tablet@1x.png new file mode 100644 index 0000000..56a58e9 Binary files /dev/null and b/source/images/ce-buckwheat-slim1000-tablet@1x.png differ diff --git a/source/images/ce-buckwheat-slim1000-tablet@1x.webp b/source/images/ce-buckwheat-slim1000-tablet@1x.webp new file mode 100644 index 0000000..ccfd09a Binary files /dev/null and b/source/images/ce-buckwheat-slim1000-tablet@1x.webp differ diff --git a/source/images/ce-buckwheat-slim1000-tablet@2x.png b/source/images/ce-buckwheat-slim1000-tablet@2x.png new file mode 100644 index 0000000..9bb9459 Binary files /dev/null and b/source/images/ce-buckwheat-slim1000-tablet@2x.png differ diff --git a/source/images/ce-buckwheat-slim1000-tablet@2x.webp b/source/images/ce-buckwheat-slim1000-tablet@2x.webp new file mode 100644 index 0000000..624f9c3 Binary files /dev/null and b/source/images/ce-buckwheat-slim1000-tablet@2x.webp differ diff --git a/source/images/ce-buckwheat-slim500-desktop@1x.png b/source/images/ce-buckwheat-slim500-desktop@1x.png new file mode 100644 index 0000000..d5e2054 Binary files /dev/null and b/source/images/ce-buckwheat-slim500-desktop@1x.png differ diff --git a/source/images/ce-buckwheat-slim500-desktop@1x.webp b/source/images/ce-buckwheat-slim500-desktop@1x.webp new file mode 100644 index 0000000..7a7bfad Binary files /dev/null and b/source/images/ce-buckwheat-slim500-desktop@1x.webp differ diff --git a/source/images/ce-buckwheat-slim500-desktop@2x.png b/source/images/ce-buckwheat-slim500-desktop@2x.png new file mode 100644 index 0000000..dce1431 Binary files /dev/null and b/source/images/ce-buckwheat-slim500-desktop@2x.png differ diff --git a/source/images/ce-buckwheat-slim500-desktop@2x.webp b/source/images/ce-buckwheat-slim500-desktop@2x.webp new file mode 100644 index 0000000..f5119e9 Binary files /dev/null and b/source/images/ce-buckwheat-slim500-desktop@2x.webp differ diff --git a/source/images/ce-buckwheat-slim500-mobile@1x.png b/source/images/ce-buckwheat-slim500-mobile@1x.png new file mode 100644 index 0000000..f76bde9 Binary files /dev/null and b/source/images/ce-buckwheat-slim500-mobile@1x.png differ diff --git a/source/images/ce-buckwheat-slim500-mobile@1x.webp b/source/images/ce-buckwheat-slim500-mobile@1x.webp new file mode 100644 index 0000000..45fb708 Binary files /dev/null and b/source/images/ce-buckwheat-slim500-mobile@1x.webp differ diff --git a/source/images/ce-buckwheat-slim500-mobile@2x.png b/source/images/ce-buckwheat-slim500-mobile@2x.png new file mode 100644 index 0000000..e2dda0c Binary files /dev/null and b/source/images/ce-buckwheat-slim500-mobile@2x.png differ diff --git a/source/images/ce-buckwheat-slim500-mobile@2x.webp b/source/images/ce-buckwheat-slim500-mobile@2x.webp new file mode 100644 index 0000000..1c5f656 Binary files /dev/null and b/source/images/ce-buckwheat-slim500-mobile@2x.webp differ diff --git a/source/images/ce-buckwheat-slim500-tablet@1x.png b/source/images/ce-buckwheat-slim500-tablet@1x.png new file mode 100644 index 0000000..5804e4d Binary files /dev/null and b/source/images/ce-buckwheat-slim500-tablet@1x.png differ diff --git a/source/images/ce-buckwheat-slim500-tablet@1x.webp b/source/images/ce-buckwheat-slim500-tablet@1x.webp new file mode 100644 index 0000000..6892d26 Binary files /dev/null and b/source/images/ce-buckwheat-slim500-tablet@1x.webp differ diff --git a/source/images/ce-buckwheat-slim500-tablet@2x.png b/source/images/ce-buckwheat-slim500-tablet@2x.png new file mode 100644 index 0000000..c92b3f1 Binary files /dev/null and b/source/images/ce-buckwheat-slim500-tablet@2x.png differ diff --git a/source/images/ce-buckwheat-slim500-tablet@2x.webp b/source/images/ce-buckwheat-slim500-tablet@2x.webp new file mode 100644 index 0000000..8612b79 Binary files /dev/null and b/source/images/ce-buckwheat-slim500-tablet@2x.webp differ diff --git a/source/images/ce-chicken-pro1000-desktop@1x.png b/source/images/ce-chicken-pro1000-desktop@1x.png new file mode 100644 index 0000000..4fa8972 Binary files /dev/null and b/source/images/ce-chicken-pro1000-desktop@1x.png differ diff --git a/source/images/ce-chicken-pro1000-desktop@1x.webp b/source/images/ce-chicken-pro1000-desktop@1x.webp new file mode 100644 index 0000000..f7b9c04 Binary files /dev/null and b/source/images/ce-chicken-pro1000-desktop@1x.webp differ diff --git a/source/images/ce-chicken-pro1000-desktop@2x.png b/source/images/ce-chicken-pro1000-desktop@2x.png new file mode 100644 index 0000000..9d12137 Binary files /dev/null and b/source/images/ce-chicken-pro1000-desktop@2x.png differ diff --git a/source/images/ce-chicken-pro1000-desktop@2x.webp b/source/images/ce-chicken-pro1000-desktop@2x.webp new file mode 100644 index 0000000..5a55b72 Binary files /dev/null and b/source/images/ce-chicken-pro1000-desktop@2x.webp differ diff --git a/source/images/ce-chicken-pro1000-mobile@1x.png b/source/images/ce-chicken-pro1000-mobile@1x.png new file mode 100644 index 0000000..3be992b Binary files /dev/null and b/source/images/ce-chicken-pro1000-mobile@1x.png differ diff --git a/source/images/ce-chicken-pro1000-mobile@1x.webp b/source/images/ce-chicken-pro1000-mobile@1x.webp new file mode 100644 index 0000000..8893f64 Binary files /dev/null and b/source/images/ce-chicken-pro1000-mobile@1x.webp differ diff --git a/source/images/ce-chicken-pro1000-mobile@2x.png b/source/images/ce-chicken-pro1000-mobile@2x.png new file mode 100644 index 0000000..a98c7cf Binary files /dev/null and b/source/images/ce-chicken-pro1000-mobile@2x.png differ diff --git a/source/images/ce-chicken-pro1000-mobile@2x.webp b/source/images/ce-chicken-pro1000-mobile@2x.webp new file mode 100644 index 0000000..06952e7 Binary files /dev/null and b/source/images/ce-chicken-pro1000-mobile@2x.webp differ diff --git a/source/images/ce-chicken-pro1000-tablet@1x.png b/source/images/ce-chicken-pro1000-tablet@1x.png new file mode 100644 index 0000000..df61854 Binary files /dev/null and b/source/images/ce-chicken-pro1000-tablet@1x.png differ diff --git a/source/images/ce-chicken-pro1000-tablet@1x.webp b/source/images/ce-chicken-pro1000-tablet@1x.webp new file mode 100644 index 0000000..aa1071a Binary files /dev/null and b/source/images/ce-chicken-pro1000-tablet@1x.webp differ diff --git a/source/images/ce-chicken-pro1000-tablet@2x.png b/source/images/ce-chicken-pro1000-tablet@2x.png new file mode 100644 index 0000000..e9bd1fd Binary files /dev/null and b/source/images/ce-chicken-pro1000-tablet@2x.png differ diff --git a/source/images/ce-chicken-pro1000-tablet@2x.webp b/source/images/ce-chicken-pro1000-tablet@2x.webp new file mode 100644 index 0000000..3dbbf65 Binary files /dev/null and b/source/images/ce-chicken-pro1000-tablet@2x.webp differ diff --git a/source/images/ce-chicken-pro500-desktop@1x.png b/source/images/ce-chicken-pro500-desktop@1x.png new file mode 100644 index 0000000..2478e73 Binary files /dev/null and b/source/images/ce-chicken-pro500-desktop@1x.png differ diff --git a/source/images/ce-chicken-pro500-desktop@1x.webp b/source/images/ce-chicken-pro500-desktop@1x.webp new file mode 100644 index 0000000..4d17f58 Binary files /dev/null and b/source/images/ce-chicken-pro500-desktop@1x.webp differ diff --git a/source/images/ce-chicken-pro500-desktop@2x.png b/source/images/ce-chicken-pro500-desktop@2x.png new file mode 100644 index 0000000..908250c Binary files /dev/null and b/source/images/ce-chicken-pro500-desktop@2x.png differ diff --git a/source/images/ce-chicken-pro500-desktop@2x.webp b/source/images/ce-chicken-pro500-desktop@2x.webp new file mode 100644 index 0000000..e435a09 Binary files /dev/null and b/source/images/ce-chicken-pro500-desktop@2x.webp differ diff --git a/source/images/ce-chicken-pro500-mobile@1x.png b/source/images/ce-chicken-pro500-mobile@1x.png new file mode 100644 index 0000000..81bfad7 Binary files /dev/null and b/source/images/ce-chicken-pro500-mobile@1x.png differ diff --git a/source/images/ce-chicken-pro500-mobile@1x.webp b/source/images/ce-chicken-pro500-mobile@1x.webp new file mode 100644 index 0000000..ef26f69 Binary files /dev/null and b/source/images/ce-chicken-pro500-mobile@1x.webp differ diff --git a/source/images/ce-chicken-pro500-mobile@2x.png b/source/images/ce-chicken-pro500-mobile@2x.png new file mode 100644 index 0000000..97128f4 Binary files /dev/null and b/source/images/ce-chicken-pro500-mobile@2x.png differ diff --git a/source/images/ce-chicken-pro500-mobile@2x.webp b/source/images/ce-chicken-pro500-mobile@2x.webp new file mode 100644 index 0000000..ad2d93d Binary files /dev/null and b/source/images/ce-chicken-pro500-mobile@2x.webp differ diff --git a/source/images/ce-chicken-pro500-tablet@1x.png b/source/images/ce-chicken-pro500-tablet@1x.png new file mode 100644 index 0000000..3031814 Binary files /dev/null and b/source/images/ce-chicken-pro500-tablet@1x.png differ diff --git a/source/images/ce-chicken-pro500-tablet@1x.webp b/source/images/ce-chicken-pro500-tablet@1x.webp new file mode 100644 index 0000000..3a050ec Binary files /dev/null and b/source/images/ce-chicken-pro500-tablet@1x.webp differ diff --git a/source/images/ce-chicken-pro500-tablet@2x.png b/source/images/ce-chicken-pro500-tablet@2x.png new file mode 100644 index 0000000..e0a0910 Binary files /dev/null and b/source/images/ce-chicken-pro500-tablet@2x.png differ diff --git a/source/images/ce-chicken-pro500-tablet@2x.webp b/source/images/ce-chicken-pro500-tablet@2x.webp new file mode 100644 index 0000000..da06d4c Binary files /dev/null and b/source/images/ce-chicken-pro500-tablet@2x.webp differ diff --git a/source/images/ce-fish-pro1000-desktop@1x.png b/source/images/ce-fish-pro1000-desktop@1x.png new file mode 100644 index 0000000..895a858 Binary files /dev/null and b/source/images/ce-fish-pro1000-desktop@1x.png differ diff --git a/source/images/ce-fish-pro1000-desktop@1x.webp b/source/images/ce-fish-pro1000-desktop@1x.webp new file mode 100644 index 0000000..8fe7e3e Binary files /dev/null and b/source/images/ce-fish-pro1000-desktop@1x.webp differ diff --git a/source/images/ce-fish-pro1000-desktop@2x.png b/source/images/ce-fish-pro1000-desktop@2x.png new file mode 100644 index 0000000..c9288a0 Binary files /dev/null and b/source/images/ce-fish-pro1000-desktop@2x.png differ diff --git a/source/images/ce-fish-pro1000-desktop@2x.webp b/source/images/ce-fish-pro1000-desktop@2x.webp new file mode 100644 index 0000000..20e200a Binary files /dev/null and b/source/images/ce-fish-pro1000-desktop@2x.webp differ diff --git a/source/images/ce-fish-pro1000-mobile@1x.png b/source/images/ce-fish-pro1000-mobile@1x.png new file mode 100644 index 0000000..a0d5157 Binary files /dev/null and b/source/images/ce-fish-pro1000-mobile@1x.png differ diff --git a/source/images/ce-fish-pro1000-mobile@1x.webp b/source/images/ce-fish-pro1000-mobile@1x.webp new file mode 100644 index 0000000..121eb9d Binary files /dev/null and b/source/images/ce-fish-pro1000-mobile@1x.webp differ diff --git a/source/images/ce-fish-pro1000-mobile@2x.png b/source/images/ce-fish-pro1000-mobile@2x.png new file mode 100644 index 0000000..919d49a Binary files /dev/null and b/source/images/ce-fish-pro1000-mobile@2x.png differ diff --git a/source/images/ce-fish-pro1000-mobile@2x.webp b/source/images/ce-fish-pro1000-mobile@2x.webp new file mode 100644 index 0000000..bd036ea Binary files /dev/null and b/source/images/ce-fish-pro1000-mobile@2x.webp differ diff --git a/source/images/ce-fish-pro1000-tablet@1x.png b/source/images/ce-fish-pro1000-tablet@1x.png new file mode 100644 index 0000000..2daab59 Binary files /dev/null and b/source/images/ce-fish-pro1000-tablet@1x.png differ diff --git a/source/images/ce-fish-pro1000-tablet@1x.webp b/source/images/ce-fish-pro1000-tablet@1x.webp new file mode 100644 index 0000000..8cc4b5f Binary files /dev/null and b/source/images/ce-fish-pro1000-tablet@1x.webp differ diff --git a/source/images/ce-fish-pro1000-tablet@2x.png b/source/images/ce-fish-pro1000-tablet@2x.png new file mode 100644 index 0000000..dfc1343 Binary files /dev/null and b/source/images/ce-fish-pro1000-tablet@2x.png differ diff --git a/source/images/ce-fish-pro1000-tablet@2x.webp b/source/images/ce-fish-pro1000-tablet@2x.webp new file mode 100644 index 0000000..0d28317 Binary files /dev/null and b/source/images/ce-fish-pro1000-tablet@2x.webp differ diff --git a/source/images/ce-fish-pro500-desktop@1x.png b/source/images/ce-fish-pro500-desktop@1x.png new file mode 100644 index 0000000..f886c6d Binary files /dev/null and b/source/images/ce-fish-pro500-desktop@1x.png differ diff --git a/source/images/ce-fish-pro500-desktop@1x.webp b/source/images/ce-fish-pro500-desktop@1x.webp new file mode 100644 index 0000000..b9162d0 Binary files /dev/null and b/source/images/ce-fish-pro500-desktop@1x.webp differ diff --git a/source/images/ce-fish-pro500-desktop@2x.png b/source/images/ce-fish-pro500-desktop@2x.png new file mode 100644 index 0000000..f4112a8 Binary files /dev/null and b/source/images/ce-fish-pro500-desktop@2x.png differ diff --git a/source/images/ce-fish-pro500-desktop@2x.webp b/source/images/ce-fish-pro500-desktop@2x.webp new file mode 100644 index 0000000..7d23d6f Binary files /dev/null and b/source/images/ce-fish-pro500-desktop@2x.webp differ diff --git a/source/images/ce-fish-pro500-mobile@1x.png b/source/images/ce-fish-pro500-mobile@1x.png new file mode 100644 index 0000000..abd1553 Binary files /dev/null and b/source/images/ce-fish-pro500-mobile@1x.png differ diff --git a/source/images/ce-fish-pro500-mobile@1x.webp b/source/images/ce-fish-pro500-mobile@1x.webp new file mode 100644 index 0000000..8076661 Binary files /dev/null and b/source/images/ce-fish-pro500-mobile@1x.webp differ diff --git a/source/images/ce-fish-pro500-mobile@2x.png b/source/images/ce-fish-pro500-mobile@2x.png new file mode 100644 index 0000000..84ddd68 Binary files /dev/null and b/source/images/ce-fish-pro500-mobile@2x.png differ diff --git a/source/images/ce-fish-pro500-mobile@2x.webp b/source/images/ce-fish-pro500-mobile@2x.webp new file mode 100644 index 0000000..9893dc0 Binary files /dev/null and b/source/images/ce-fish-pro500-mobile@2x.webp differ diff --git a/source/images/ce-fish-pro500-tablet@1x.png b/source/images/ce-fish-pro500-tablet@1x.png new file mode 100644 index 0000000..64b310b Binary files /dev/null and b/source/images/ce-fish-pro500-tablet@1x.png differ diff --git a/source/images/ce-fish-pro500-tablet@1x.webp b/source/images/ce-fish-pro500-tablet@1x.webp new file mode 100644 index 0000000..b3fa1ee Binary files /dev/null and b/source/images/ce-fish-pro500-tablet@1x.webp differ diff --git a/source/images/ce-fish-pro500-tablet@2x.png b/source/images/ce-fish-pro500-tablet@2x.png new file mode 100644 index 0000000..affb0fd Binary files /dev/null and b/source/images/ce-fish-pro500-tablet@2x.png differ diff --git a/source/images/ce-fish-pro500-tablet@2x.webp b/source/images/ce-fish-pro500-tablet@2x.webp new file mode 100644 index 0000000..d03dea0 Binary files /dev/null and b/source/images/ce-fish-pro500-tablet@2x.webp differ diff --git a/source/images/ce-rice-slim500-desktop@1x.png b/source/images/ce-rice-slim500-desktop@1x.png new file mode 100644 index 0000000..42aa542 Binary files /dev/null and b/source/images/ce-rice-slim500-desktop@1x.png differ diff --git a/source/images/ce-rice-slim500-desktop@1x.webp b/source/images/ce-rice-slim500-desktop@1x.webp new file mode 100644 index 0000000..47bc20b Binary files /dev/null and b/source/images/ce-rice-slim500-desktop@1x.webp differ diff --git a/source/images/ce-rice-slim500-desktop@2x.png b/source/images/ce-rice-slim500-desktop@2x.png new file mode 100644 index 0000000..55f2dde Binary files /dev/null and b/source/images/ce-rice-slim500-desktop@2x.png differ diff --git a/source/images/ce-rice-slim500-desktop@2x.webp b/source/images/ce-rice-slim500-desktop@2x.webp new file mode 100644 index 0000000..8955109 Binary files /dev/null and b/source/images/ce-rice-slim500-desktop@2x.webp differ diff --git a/source/images/ce-rice-slim500-mobile@1x.png b/source/images/ce-rice-slim500-mobile@1x.png new file mode 100644 index 0000000..b749e3a Binary files /dev/null and b/source/images/ce-rice-slim500-mobile@1x.png differ diff --git a/source/images/ce-rice-slim500-mobile@1x.webp b/source/images/ce-rice-slim500-mobile@1x.webp new file mode 100644 index 0000000..28e0e3d Binary files /dev/null and b/source/images/ce-rice-slim500-mobile@1x.webp differ diff --git a/source/images/ce-rice-slim500-mobile@2x.png b/source/images/ce-rice-slim500-mobile@2x.png new file mode 100644 index 0000000..436d513 Binary files /dev/null and b/source/images/ce-rice-slim500-mobile@2x.png differ diff --git a/source/images/ce-rice-slim500-mobile@2x.webp b/source/images/ce-rice-slim500-mobile@2x.webp new file mode 100644 index 0000000..52a5068 Binary files /dev/null and b/source/images/ce-rice-slim500-mobile@2x.webp differ diff --git a/source/images/ce-rice-slim500-tablet@1x.png b/source/images/ce-rice-slim500-tablet@1x.png new file mode 100644 index 0000000..7b0745c Binary files /dev/null and b/source/images/ce-rice-slim500-tablet@1x.png differ diff --git a/source/images/ce-rice-slim500-tablet@1x.webp b/source/images/ce-rice-slim500-tablet@1x.webp new file mode 100644 index 0000000..f26f0c6 Binary files /dev/null and b/source/images/ce-rice-slim500-tablet@1x.webp differ diff --git a/source/images/ce-rice-slim500-tablet@2x.png b/source/images/ce-rice-slim500-tablet@2x.png new file mode 100644 index 0000000..a71e110 Binary files /dev/null and b/source/images/ce-rice-slim500-tablet@2x.png differ diff --git a/source/images/ce-rice-slim500-tablet@2x.webp b/source/images/ce-rice-slim500-tablet@2x.webp new file mode 100644 index 0000000..db01a35 Binary files /dev/null and b/source/images/ce-rice-slim500-tablet@2x.webp differ diff --git a/source/images/intro-bg-licking-cat-desktop@1x.jpg b/source/images/intro-bg-licking-cat-desktop@1x.jpg new file mode 100644 index 0000000..31d58ba Binary files /dev/null and b/source/images/intro-bg-licking-cat-desktop@1x.jpg differ diff --git a/source/images/intro-bg-licking-cat-desktop@1x.webp b/source/images/intro-bg-licking-cat-desktop@1x.webp new file mode 100644 index 0000000..8de5a0d Binary files /dev/null and b/source/images/intro-bg-licking-cat-desktop@1x.webp differ diff --git a/source/images/intro-bg-licking-cat-desktop@2x.jpg b/source/images/intro-bg-licking-cat-desktop@2x.jpg new file mode 100644 index 0000000..d70cf5a Binary files /dev/null and b/source/images/intro-bg-licking-cat-desktop@2x.jpg differ diff --git a/source/images/intro-bg-licking-cat-desktop@2x.webp b/source/images/intro-bg-licking-cat-desktop@2x.webp new file mode 100644 index 0000000..09fde1b Binary files /dev/null and b/source/images/intro-bg-licking-cat-desktop@2x.webp differ diff --git a/source/images/intro-bg-licking-cat-mobile@1x.jpg b/source/images/intro-bg-licking-cat-mobile@1x.jpg new file mode 100644 index 0000000..ba689e5 Binary files /dev/null and b/source/images/intro-bg-licking-cat-mobile@1x.jpg differ diff --git a/source/images/intro-bg-licking-cat-mobile@1x.webp b/source/images/intro-bg-licking-cat-mobile@1x.webp new file mode 100644 index 0000000..f3d8fe6 Binary files /dev/null and b/source/images/intro-bg-licking-cat-mobile@1x.webp differ diff --git a/source/images/intro-bg-licking-cat-mobile@2x.jpg b/source/images/intro-bg-licking-cat-mobile@2x.jpg new file mode 100644 index 0000000..ac3bc91 Binary files /dev/null and b/source/images/intro-bg-licking-cat-mobile@2x.jpg differ diff --git a/source/images/intro-bg-licking-cat-mobile@2x.webp b/source/images/intro-bg-licking-cat-mobile@2x.webp new file mode 100644 index 0000000..7aee113 Binary files /dev/null and b/source/images/intro-bg-licking-cat-mobile@2x.webp differ diff --git a/source/images/intro-cat-energy-desktop@1x.png b/source/images/intro-cat-energy-desktop@1x.png new file mode 100644 index 0000000..7f065de Binary files /dev/null and b/source/images/intro-cat-energy-desktop@1x.png differ diff --git a/source/images/intro-cat-energy-desktop@1x.webp b/source/images/intro-cat-energy-desktop@1x.webp new file mode 100644 index 0000000..e3450fb Binary files /dev/null and b/source/images/intro-cat-energy-desktop@1x.webp differ diff --git a/source/images/intro-cat-energy-desktop@2x.png b/source/images/intro-cat-energy-desktop@2x.png new file mode 100644 index 0000000..5f3ab12 Binary files /dev/null and b/source/images/intro-cat-energy-desktop@2x.png differ diff --git a/source/images/intro-cat-energy-desktop@2x.webp b/source/images/intro-cat-energy-desktop@2x.webp new file mode 100644 index 0000000..f634b88 Binary files /dev/null and b/source/images/intro-cat-energy-desktop@2x.webp differ diff --git a/source/images/intro-cat-energy-mobile@1x.png b/source/images/intro-cat-energy-mobile@1x.png new file mode 100644 index 0000000..d01bb07 Binary files /dev/null and b/source/images/intro-cat-energy-mobile@1x.png differ diff --git a/source/images/intro-cat-energy-mobile@1x.webp b/source/images/intro-cat-energy-mobile@1x.webp new file mode 100644 index 0000000..2d746e3 Binary files /dev/null and b/source/images/intro-cat-energy-mobile@1x.webp differ diff --git a/source/images/intro-cat-energy-mobile@2x.png b/source/images/intro-cat-energy-mobile@2x.png new file mode 100644 index 0000000..e4814b9 Binary files /dev/null and b/source/images/intro-cat-energy-mobile@2x.png differ diff --git a/source/images/intro-cat-energy-mobile@2x.webp b/source/images/intro-cat-energy-mobile@2x.webp new file mode 100644 index 0000000..0e86245 Binary files /dev/null and b/source/images/intro-cat-energy-mobile@2x.webp differ diff --git a/source/images/intro-cat-energy-tablet@1x.png b/source/images/intro-cat-energy-tablet@1x.png new file mode 100644 index 0000000..dd30999 Binary files /dev/null and b/source/images/intro-cat-energy-tablet@1x.png differ diff --git a/source/images/intro-cat-energy-tablet@1x.webp b/source/images/intro-cat-energy-tablet@1x.webp new file mode 100644 index 0000000..9ca6e30 Binary files /dev/null and b/source/images/intro-cat-energy-tablet@1x.webp differ diff --git a/source/images/intro-cat-energy-tablet@2x.png b/source/images/intro-cat-energy-tablet@2x.png new file mode 100644 index 0000000..b36d4e6 Binary files /dev/null and b/source/images/intro-cat-energy-tablet@2x.png differ diff --git a/source/images/intro-cat-energy-tablet@2x.webp b/source/images/intro-cat-energy-tablet@2x.webp new file mode 100644 index 0000000..947527e Binary files /dev/null and b/source/images/intro-cat-energy-tablet@2x.webp differ diff --git a/source/images/logo-cat-energy-img-desktop.svg b/source/images/logo-cat-energy-img-desktop.svg new file mode 100644 index 0000000..c25a96c --- /dev/null +++ b/source/images/logo-cat-energy-img-desktop.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/images/logo-cat-energy-img-mobile.svg b/source/images/logo-cat-energy-img-mobile.svg new file mode 100644 index 0000000..75b42a2 --- /dev/null +++ b/source/images/logo-cat-energy-img-mobile.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/images/logo-cat-energy-img-tablet.svg b/source/images/logo-cat-energy-img-tablet.svg new file mode 100644 index 0000000..5515d0b --- /dev/null +++ b/source/images/logo-cat-energy-img-tablet.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/images/logo-cat-energy-text.svg b/source/images/logo-cat-energy-text.svg new file mode 100644 index 0000000..cc386ea --- /dev/null +++ b/source/images/logo-cat-energy-text.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/images/map-reserve-desktop@1x.jpg b/source/images/map-reserve-desktop@1x.jpg new file mode 100644 index 0000000..77988d4 Binary files /dev/null and b/source/images/map-reserve-desktop@1x.jpg differ diff --git a/source/images/map-reserve-desktop@1x.webp b/source/images/map-reserve-desktop@1x.webp new file mode 100644 index 0000000..c38aec6 Binary files /dev/null and b/source/images/map-reserve-desktop@1x.webp differ diff --git a/source/images/map-reserve-desktop@2x.jpg b/source/images/map-reserve-desktop@2x.jpg new file mode 100644 index 0000000..4646d10 Binary files /dev/null and b/source/images/map-reserve-desktop@2x.jpg differ diff --git a/source/images/map-reserve-desktop@2x.webp b/source/images/map-reserve-desktop@2x.webp new file mode 100644 index 0000000..93a32b3 Binary files /dev/null and b/source/images/map-reserve-desktop@2x.webp differ diff --git a/source/images/map-reserve-mobile@1x.jpg b/source/images/map-reserve-mobile@1x.jpg new file mode 100644 index 0000000..dd1b7ed Binary files /dev/null and b/source/images/map-reserve-mobile@1x.jpg differ diff --git a/source/images/map-reserve-mobile@1x.webp b/source/images/map-reserve-mobile@1x.webp new file mode 100644 index 0000000..0abd19f Binary files /dev/null and b/source/images/map-reserve-mobile@1x.webp differ diff --git a/source/images/map-reserve-mobile@2x.jpg b/source/images/map-reserve-mobile@2x.jpg new file mode 100644 index 0000000..e87cad1 Binary files /dev/null and b/source/images/map-reserve-mobile@2x.jpg differ diff --git a/source/images/map-reserve-mobile@2x.webp b/source/images/map-reserve-mobile@2x.webp new file mode 100644 index 0000000..6c05ea9 Binary files /dev/null and b/source/images/map-reserve-mobile@2x.webp differ diff --git a/source/images/map-reserve-tablet@1x.jpg b/source/images/map-reserve-tablet@1x.jpg new file mode 100644 index 0000000..6577fdc Binary files /dev/null and b/source/images/map-reserve-tablet@1x.jpg differ diff --git a/source/images/map-reserve-tablet@1x.webp b/source/images/map-reserve-tablet@1x.webp new file mode 100644 index 0000000..542c108 Binary files /dev/null and b/source/images/map-reserve-tablet@1x.webp differ diff --git a/source/images/map-reserve-tablet@2x.jpg b/source/images/map-reserve-tablet@2x.jpg new file mode 100644 index 0000000..1775585 Binary files /dev/null and b/source/images/map-reserve-tablet@2x.jpg differ diff --git a/source/images/map-reserve-tablet@2x.webp b/source/images/map-reserve-tablet@2x.webp new file mode 100644 index 0000000..cb4c4fb Binary files /dev/null and b/source/images/map-reserve-tablet@2x.webp differ diff --git a/source/images/slider-fat-cat-mobile@1x.png b/source/images/slider-fat-cat-mobile@1x.png new file mode 100644 index 0000000..cba448e Binary files /dev/null and b/source/images/slider-fat-cat-mobile@1x.png differ diff --git a/source/images/slider-fat-cat-mobile@1x.webp b/source/images/slider-fat-cat-mobile@1x.webp new file mode 100644 index 0000000..2fb0f88 Binary files /dev/null and b/source/images/slider-fat-cat-mobile@1x.webp differ diff --git a/source/images/slider-fat-cat-mobile@2x.png b/source/images/slider-fat-cat-mobile@2x.png new file mode 100644 index 0000000..b93870a Binary files /dev/null and b/source/images/slider-fat-cat-mobile@2x.png differ diff --git a/source/images/slider-fat-cat-mobile@2x.webp b/source/images/slider-fat-cat-mobile@2x.webp new file mode 100644 index 0000000..eaad87f Binary files /dev/null and b/source/images/slider-fat-cat-mobile@2x.webp differ diff --git a/source/images/slider-fat-cat-tablet@1x.png b/source/images/slider-fat-cat-tablet@1x.png new file mode 100644 index 0000000..c6c3e84 Binary files /dev/null and b/source/images/slider-fat-cat-tablet@1x.png differ diff --git a/source/images/slider-fat-cat-tablet@1x.webp b/source/images/slider-fat-cat-tablet@1x.webp new file mode 100644 index 0000000..c1875f4 Binary files /dev/null and b/source/images/slider-fat-cat-tablet@1x.webp differ diff --git a/source/images/slider-fat-cat-tablet@2x.png b/source/images/slider-fat-cat-tablet@2x.png new file mode 100644 index 0000000..747be76 Binary files /dev/null and b/source/images/slider-fat-cat-tablet@2x.png differ diff --git a/source/images/slider-fat-cat-tablet@2x.webp b/source/images/slider-fat-cat-tablet@2x.webp new file mode 100644 index 0000000..3c14736 Binary files /dev/null and b/source/images/slider-fat-cat-tablet@2x.webp differ diff --git a/source/images/slider-slim-cat-mobile@1x.png b/source/images/slider-slim-cat-mobile@1x.png new file mode 100644 index 0000000..3da18f5 Binary files /dev/null and b/source/images/slider-slim-cat-mobile@1x.png differ diff --git a/source/images/slider-slim-cat-mobile@1x.webp b/source/images/slider-slim-cat-mobile@1x.webp new file mode 100644 index 0000000..7e89d88 Binary files /dev/null and b/source/images/slider-slim-cat-mobile@1x.webp differ diff --git a/source/images/slider-slim-cat-mobile@2x.png b/source/images/slider-slim-cat-mobile@2x.png new file mode 100644 index 0000000..1602a18 Binary files /dev/null and b/source/images/slider-slim-cat-mobile@2x.png differ diff --git a/source/images/slider-slim-cat-mobile@2x.webp b/source/images/slider-slim-cat-mobile@2x.webp new file mode 100644 index 0000000..bc06e31 Binary files /dev/null and b/source/images/slider-slim-cat-mobile@2x.webp differ diff --git a/source/images/slider-slim-cat-tablet@1x.png b/source/images/slider-slim-cat-tablet@1x.png new file mode 100644 index 0000000..a32391d Binary files /dev/null and b/source/images/slider-slim-cat-tablet@1x.png differ diff --git a/source/images/slider-slim-cat-tablet@1x.webp b/source/images/slider-slim-cat-tablet@1x.webp new file mode 100644 index 0000000..d48fa6b Binary files /dev/null and b/source/images/slider-slim-cat-tablet@1x.webp differ diff --git a/source/images/slider-slim-cat-tablet@2x.png b/source/images/slider-slim-cat-tablet@2x.png new file mode 100644 index 0000000..2c8410b Binary files /dev/null and b/source/images/slider-slim-cat-tablet@2x.png differ diff --git a/source/images/slider-slim-cat-tablet@2x.webp b/source/images/slider-slim-cat-tablet@2x.webp new file mode 100644 index 0000000..50c32eb Binary files /dev/null and b/source/images/slider-slim-cat-tablet@2x.webp differ diff --git a/source/index.html b/source/index.html index 1eddeaf..a7db091 100644 --- a/source/index.html +++ b/source/index.html @@ -1,13 +1,189 @@ - - - Название проекта - - - - - -
Шапка
- + + + + Главная страница Cat Energy + + + + + + + + + + + + +
+ + + + + Логотип Cat Energy + + + + Текстовый вариант логотипа Cat Energy + + + +
+
+
+
+

Функциональное питание для котов

+

Занялся собой? Займись котом!

+ + + + + + + Баночка корма Car Energy + + Подобрать программу +
+
+
+

Программы питания

+ +
+
+

Как это работает

+ +
+
+
+

Живой пример

+

Борис сбросил 5 кг за 2 месяца, просто заменив свой обычный корм на Cat Energy Slim. Отличный результат без изнуряющих тренировок! При этом он не менял своих привычек и по-прежнему спит по 16 часов в день.

+
+
+
Снижение веса
+
5 кг
+
+
+
Затрачено времени
+
60 дней
+
+
+
Затраты на питание:
+
15 000 руб.
+
+
+
+ + + + + Пухлый котик + +
+ +
+ + + + + Котик без лишнего веса + +
+
+
+
+
+

Приглашаем к сотрудничеству дилеров!

+
+

ул. Большая Конюшенная, д. 19/8

+

Санкт-Петербург

+
+
+
+ + + + + + + Карта с отмеченной локацией магазина Cat Energy + + +
+
+
+ + + diff --git a/source/manifest.webmanifest b/source/manifest.webmanifest new file mode 100644 index 0000000..4163527 --- /dev/null +++ b/source/manifest.webmanifest @@ -0,0 +1,19 @@ +{ + "icons": [ + { + "src": "favicons/180.png", + "type": "image/png", + "sizes": "180x180" + }, + { + "src": "favicons/192.png", + "type": "image/png", + "sizes": "192x192" + }, + { + "src": "favicons/512.png", + "type": "image/png", + "sizes": "512x512" + } + ] +} diff --git a/source/scripts/catalog.js b/source/scripts/catalog.js new file mode 100644 index 0000000..aed9c12 --- /dev/null +++ b/source/scripts/catalog.js @@ -0,0 +1,30 @@ +const navMain = document.querySelector('.navigation'); +const buttonToggle = document.querySelector('.button-toggle'); +const navToggle = document.querySelector('.header__toggle'); + +navMain.classList.remove('navigation--nojs'); +navMain.classList.remove('navigation--open'); +navMain.classList.add('navigation--close'); +buttonToggle.classList.add('button-toggle--open'); +buttonToggle.classList.remove('button-toggle--nojs'); + + +navToggle.addEventListener('click', () => { + if (navMain.classList.contains('navigation--close')) { + navMain.classList.remove('navigation--close'); + navMain.classList.add('navigation--open'); + } else { + navMain.classList.add('navigation--close'); + navMain.classList.remove('navigation--open'); + } +}); + +navToggle.addEventListener('click', () => { + if (navToggle.classList.contains('button-toggle--open')) { + navToggle.classList.remove('button-toggle--open'); + navToggle.classList.add('button-toggle--close'); + } else { + navToggle.classList.add('button-toggle--open'); + navToggle.classList.remove('button-toggle--close'); + } +}); diff --git a/source/scripts/index.js b/source/scripts/index.js index 7a738ce..8ae325f 100644 --- a/source/scripts/index.js +++ b/source/scripts/index.js @@ -1 +1,56 @@ -/* в этот файл добавляет скрипты*/ +const navMain = document.querySelector('.navigation'); +const buttonToggle = document.querySelector('.button-toggle'); +const navToggle = document.querySelector('.header__toggle'); + +navMain.classList.remove('navigation--nojs'); +navMain.classList.remove('navigation--open'); +navMain.classList.add('navigation--close'); +buttonToggle.classList.add('button-toggle--open'); +buttonToggle.classList.remove('button-toggle--nojs'); + + +navToggle.addEventListener('click', () => { + if (navMain.classList.contains('navigation--close')) { + navMain.classList.remove('navigation--close'); + navMain.classList.add('navigation--open'); + } else { + navMain.classList.add('navigation--close'); + navMain.classList.remove('navigation--open'); + } +}); + +navToggle.addEventListener('click', () => { + if (navToggle.classList.contains('button-toggle--open')) { + navToggle.classList.remove('button-toggle--open'); + navToggle.classList.add('button-toggle--close'); + } else { + navToggle.classList.add('button-toggle--open'); + navToggle.classList.remove('button-toggle--close'); + } +}); + +const slider = document.querySelector('.slider'); +const range = slider.querySelector('.slider__range'); +const sliderStyles = getComputedStyle(slider); +let rangePlaceStart; +let clientX; + +window.addEventListener('pointerup', stopTheRangeShifting); +range.addEventListener('pointerdown', startTheRangeShifting); + +function startTheRangeShifting (event) { + rangePlaceStart = Number(sliderStyles.getPropertyValue('--range')); + clientX = event.clientX; + window.addEventListener('pointermove', shiftТheRange); +} + +function shiftТheRange (event) { + const deltaX = event.clientX - clientX; + const cursorPlace = rangePlaceStart + deltaX / slider.clientWidth; + const curtainPlace = Math.min(Math.max(cursorPlace, 0), 1); + slider.style.setProperty('--range', `${curtainPlace}`); +} + +function stopTheRangeShifting () { + window.removeEventListener('pointermove', shiftТheRange); +} diff --git a/source/styles/blocks/accent-line.scss b/source/styles/blocks/accent-line.scss new file mode 100644 index 0000000..388c620 --- /dev/null +++ b/source/styles/blocks/accent-line.scss @@ -0,0 +1,34 @@ +.accent-line { + position: relative; + width: fit-content; + box-shadow: -40px 0 0 0 $color-contrast-text, 40px 0 0 0 $color-contrast-text; + background: $color-contrast-text; + + &::before { + position: absolute; + content: ""; + top: 10px; + right: 0; + width: 100vw; + height: 2px; + background: $color-accent; + box-shadow: 100vw 0 0 0 $color-accent; + z-index: -1; + } +} + +@media (min-width: $tablet-width) { + .accent-line { + &::before { + top: 14px; + } + } +} + +@media (min-width: $desktop-width) { + .accent-line { + &::before { + top: 18px; + } + } +} diff --git a/source/styles/blocks/address.scss b/source/styles/blocks/address.scss new file mode 100644 index 0000000..72366e9 --- /dev/null +++ b/source/styles/blocks/address.scss @@ -0,0 +1,82 @@ +.address--secondary { + background-color: $color-bg-primary; +} + +.address__wrapper { + display: flex; + margin: 0 auto; + padding: 26px 0; +} + +.address__title { + font-size: 16px; + line-height: calc(20/16); + text-transform: uppercase; + color: $text-color-accent-2; + width: 50%; +} + +.address__description-wrapper { + width: 50%; +} + +.address__text { + line-height: calc(20/14); + color: $text-color-base; + margin: 0; +} + +@media (min-width: $tablet-width) { + .address__wrapper { + padding: 60px 40px; + box-sizing: border-box; + } + + .address__title { + font-size: 20px; + line-height: calc(26/20); + text-align: left; + max-width: 190px; + } + + .address__description-wrapper { + display: flex; + flex-direction: column; + max-width: 190px; + margin-left: auto; + text-align: right; + gap: 20px; + } + + .address__text { + font-size: 16px; + line-height: calc(20/16); + } +} + +@media (min-width: $desktop-width) { + .address { + display: grid; + grid-template-rows: 95px auto 106px; + grid-template-columns: auto 565px 90px 565px auto; + min-width: 100%; + min-height: 400px; + margin: 0 auto; + + .wrapper { + width: 565px; + } + } + + .address__wrapper { + z-index: 2; + background-color: $color-contrast-text; + grid-area: 2 / 2 / 3 / 3; + padding: 60px 80px; + } + + .address__description-wrapper { + width: 157px; + text-align: start; + } +} diff --git a/source/styles/blocks/advantages.scss b/source/styles/blocks/advantages.scss new file mode 100644 index 0000000..352ce94 --- /dev/null +++ b/source/styles/blocks/advantages.scss @@ -0,0 +1,126 @@ +.advantages { + margin: 0 auto 49px; +} + +.advantages__title { + font-size: 36px; + line-height: calc(40/36); + color: $text-color-accent; + margin-bottom: 40px; +} + +.advantages__list { + list-style-type: none; + padding: 0; + display: flex; + flex-direction: column; + gap: 20px; + margin: 0; +} + +.advantages__description { + position: relative; + margin: 0; + display: flex; + min-height: 60px; + padding-left: 80px; + align-items: center; + + &::before { + content: ""; + background-color: $color-accent; + background-repeat: no-repeat; + background-position: center; + width: 60px; + height: 60px; + position: absolute; + left: 0; + top: 0; + } + + &--benefit::before { + background-image: url("../../icons/stack.svg#icon-benefit"); + background-size: 25px 28px; + } + + &--usability::before { + background-image: url("../../icons/stack.svg#icon-usability"); + background-size: 26px 28px; + } + + &--change::before { + background-image: url("../../icons/stack.svg#icon-change"); + background-size: 25px 30px; + } + + &--improvement::before { + background-image: url("../../icons/stack.svg#icon-improvement"); + background-size: 26px 31px; + } +} + +@media (min-width: $tablet-width) { + .advantages { + margin-bottom: 46px; + } + + .advantages__title { + font-size: 60px; + line-height: 1; + margin-bottom: 32px; + } + + .advantages__list { + display: flex; + flex-flow: wrap; + gap: 37px 134px; + margin: 0 auto; + } + + .advantages__item { + width: 250px; + min-height: 280px; + position: relative; + counter-increment: counter; + + &::before { + position: absolute; + content: counter(counter); + font-size: 280px; + font-family: $font-secondary; + line-height: 1; + color: $color-bg-primary; + z-index: -1; + left: 114px; + top: 0; + } + } + + .advantages__description { + font-size: 16px; + line-height: calc(24/16); + position: static; + padding-left: 0; + padding-top: 151px; + + &::before { + width: 80px; + height: 80px; + margin-top: 40px; + } + } +} + +@media (min-width: $desktop-width) { + .advantages { + margin-bottom: 69px; + } + + .advantages__list { + column-gap: 80px; + } + + .advantages__item { + width: 245px; + } +} diff --git a/source/styles/blocks/button-toggle.scss b/source/styles/blocks/button-toggle.scss new file mode 100644 index 0000000..6c0cadd --- /dev/null +++ b/source/styles/blocks/button-toggle.scss @@ -0,0 +1,50 @@ +.button-toggle { + display: block; + mask-repeat: no-repeat; + border: none; + cursor: pointer; + box-sizing: border-box; + background-color: transparent; + padding: 10px 0 10px 15px; + + &::before { + display: block; + content: ""; + background-color: $text-color-accent; + mask-position: 50%; + mask-repeat: no-repeat; + } + + &--open::before { + mask-image: url("../../icons/stack.svg#button-toggle"); + mask-size: 24px 24px; + width: 24px; + height: 24px; + } + + &--close::before { + mask-image: url("../../icons/stack.svg#button-cross"); + mask-size: 18px 18px; + width: 18px; + height: 18px; + } + + &--nojs::before { + display: none; + } + + &:hover::before, + &:focus-visible::before { + opacity: 0.7; + } + + &:active::before { + opacity: 0.4; + } +} + +@media (min-width: $tablet-width) { + .button-toggle { + display: none; + } +} diff --git a/source/styles/blocks/button.scss b/source/styles/blocks/button.scss new file mode 100644 index 0000000..0c84cd0 --- /dev/null +++ b/source/styles/blocks/button.scss @@ -0,0 +1,58 @@ +.button { + font-family: $font-secondary; + font-size: 16px; + line-height: calc(20/16); + text-transform: uppercase; + color: $color-contrast-text; + background-color: $color-accent; + text-decoration: none; + box-sizing: border-box; + border: none; + cursor: pointer; + display: block; + padding: 10px; + + &--base { + font-size: 20px; + line-height: calc(26/20); + + &:hover, + &:focus-visible { + background-color: $color-accent-6; + } + + &:active { + color: rgba($color-contrast-text, 0.3); + } + } + + &--primary { + &:hover, + &:focus-visible { + background-color: $color-accent-6; + } + + &:active { + color: rgba($color-contrast-text, 0.3); + } + } + + &--secondary { + color: $text-color-base; + background-color: $color-bg-primary; + + &:hover, + &:focus-visible { + background-color: $color-accent-5; + } + + &:active { + background-color: $color-accent-3; + } + } + + &:disabled { + opacity: 0.2; + pointer-events: none; + } +} diff --git a/source/styles/blocks/card-more.scss b/source/styles/blocks/card-more.scss new file mode 100644 index 0000000..67e13ec --- /dev/null +++ b/source/styles/blocks/card-more.scss @@ -0,0 +1,96 @@ +.card-more__wrapper { + display: flex; + flex-direction: column; + row-gap: 0; + width: 280px; + margin: 0 auto; + padding: 25px 0; + text-align: center; +} + +.card-more__title { + display: flex; + flex-direction: column; + align-items: center; + font-size: 16px; + line-height: calc(20/16); + text-transform: uppercase; + color: $text-color-accent-2; + + &::before { + content: ""; + background-image: url("../../icons/stack.svg#icon-plus"); + background-size: 30px 30px; + background-repeat: no-repeat; + width: 30px; + height: 30px; + display: block; + margin-bottom: 23px; + } +} + +.card-more__text { + font-size: 12px; + line-height: calc(16/12); + margin: 8px 0 21px; +} + +@media (min-width: $tablet-width) { + .card-more { + background-image: none; + padding: 81px 0 0; + box-sizing: border-box; + } + + .card-more__wrapper { + min-height: 100%; + box-sizing: border-box; + padding: 50px 37px 40px; + border: 2px solid $color-bg-primary; + } + + .card-more__title { + font-size: 20px; + line-height: calc(24/20); + padding: 0 50px; + margin-bottom: 23px; + + &::before { + background-size: 60px 60px; + width: 60px; + height: 60px; + margin-bottom: 49px; + } + } + + .card-more__text { + font-size: 16px; + line-height: calc(18/16); + padding: 0 30px; + margin-top: 0; + } + + .card-more__button { + margin-top: auto; + } +} + +@media (min-width: $desktop-width) { + .card-more__wrapper { + padding-bottom: 39px; + } + + .card-more__title { + padding: 0 10px; + margin-bottom: 26px; + + &::before { + margin-bottom: 38px; + } + } + + .card-more__text { + padding: 0; + margin-top: 0; + } +} diff --git a/source/styles/blocks/card.scss b/source/styles/blocks/card.scss new file mode 100644 index 0000000..a5be6b5 --- /dev/null +++ b/source/styles/blocks/card.scss @@ -0,0 +1,167 @@ +.card { + border-top: 1px solid $color-accent-5; + width: 100%; + + &:last-child { + border-bottom: 1px solid $color-accent-5; + } + + .wrapper { + width: 280px; + } +} + +.card__wrapper { + display: grid; + grid-template-columns: repeat(2, 50%); + row-gap: 5px; + padding: 20px 0 24px; +} + +.card__link { + display: flex; + grid-column: 1 / 2; + grid-row: 1 / 3; + justify-content: center; + align-items: center; + width: 140px; + height: 107px; +} + +.card__link-title { + grid-column: 2 / 3; + grid-row: 1 / 2; + text-decoration: none; + text-transform: uppercase; + + &:hover, + &:focus-visible { + opacity: 0.6; + } + + &:active { + opacity: 0.3; + } +} + +.card__title { + max-width: 95px; + font-size: 16px; + line-height: calc(20/16); + text-transform: uppercase; + text-decoration: none; + color: $text-color-accent-4; +} + +.card__characteristic { + display: grid; + grid-template-columns: repeat(2, 50%); + font-size: 12px; + line-height: 1; + margin: 0; +} + +.card__characteristic-number { + margin-left: auto; +} + +.card__button { + grid-column: -1 / 1; + margin-top: 12px; +} + +@media (min-width: $tablet-width) { + .card { + min-height: 511px; + background-image: linear-gradient($color-contrast-text 81px, $color-bg-primary 81px); + border: none; + + .wrapper { + width: auto; + } + + &:last-child { + border: none; + } + } + + .card__wrapper { + display: flex; + flex-direction: column; + align-items: center; + padding: 10px 37px 40px; + row-gap: 20px; + min-height: 100%; + box-sizing: border-box; + } + + .card__link { + width: 200px; + height: 210px; + + &:hover { + opacity: 0.8; + } + + &:active { + opacity: 0.6; + } + } + + .card__title { + font-size: 20px; + line-height: calc(24/20); + max-width: 135px; + text-align: center; + margin-top: 2px; + } + + .card__characteristic { + margin-bottom: 5px; + font-size: 16px; + line-height: calc(20/16); + width: 100%; + row-gap: 7px; + } + + .card__characteristic-term { + &::after { + content: ""; + display: block; + background-color: $color-accent-4; + width: 200%; + height: 1px; + margin-top: 4px; + } + } + + .card__button { + margin-top: auto; + width: 100%; + } +} + +@media (min-width: $desktop-width) { + .card__wrapper { + row-gap: 12px; + } + + .card__title { + margin-top: 0; + margin-bottom: 13px; + } + + .card__link { + width: 169px; + } + + .card__characteristic { + row-gap: 7px; + } + + .card__characteristic-term { + &::after { + margin-top: 5px; + } + } +} diff --git a/source/styles/blocks/catalog.scss b/source/styles/blocks/catalog.scss new file mode 100644 index 0000000..0f9bf98 --- /dev/null +++ b/source/styles/blocks/catalog.scss @@ -0,0 +1,79 @@ +.catalog { + margin-bottom: 24px; +} + +.catalog__wrapper { + border-top: 1px solid $color-accent-3; + min-width: 100%; +} + +.catalog__title { + font-size: 36px; + line-height: 1; + color: $text-color-accent; + margin: 27px auto 40px; + width: 280px; +} + +.catalog__list-wrapper { + .wrapper { + width: 100%; + } +} + +.catalog__list { + list-style-type: none; + padding: 0; +} + +@media (min-width: $tablet-width) { + .catalog { + width: calc($tablet-width - 60px); + margin: 0 auto 74px; + padding-top: 26px; + } + + .catalog__wrapper { + border: none; + } + + .catalog__title { + font-size: 60px; + line-height: 1; + margin: 0 auto 84px 0; + width: 500px; + } + + + .catalog__list-wrapper { + .wrapper { + width: calc($tablet-width - 60px); + } + } + + .catalog__list { + display: grid; + grid-template-columns: repeat(2, 324px); + gap: 60px; + margin: 0 auto; + } +} + +@media (min-width: $desktop-width) { + .catalog { + width: calc($desktop-width - 220px); + margin: 0 auto 71px; + padding-top: 45px; + } + + .catalog__list-wrapper { + .wrapper { + width: calc($desktop-width - 220px); + } + } + + .catalog__list { + grid-template-columns: repeat(4, 245px); + gap: 63px 80px; + } +} diff --git a/source/styles/blocks/developer.scss b/source/styles/blocks/developer.scss new file mode 100644 index 0000000..b752af5 --- /dev/null +++ b/source/styles/blocks/developer.scss @@ -0,0 +1,51 @@ +.developer__link { + display: flex; + align-items: center; + font-size: 16px; + line-height: calc(20/16); + text-decoration: none; + color: $text-color-base; + + &:hover, + &:focus-visible { + opacity: 0.7; + } + + &:active { + opacity: 0.4; + } + + &::after { + content: ""; + background-color: $text-color-accent-3; + mask-image: url("../../icons/stack.svg#icon-htmlacademy"); + mask-repeat: no-repeat; + mask-size: 27px 34px; + width: 27px; + height: 34px; + display: block; + cursor: pointer; + margin-left: auto; + } + + &:hover::after, + &:focus-visible::after { + background-color: $color-accent; + } + + &:active::after { + background-color: $color-accent; + } +} + +@media (min-width: $tablet-width) { + .developer__link { + justify-content: end; + width: 170px; + padding: 15px 0; + } + + .developer__link::after { + margin-left: 23px; + } +} diff --git a/source/styles/blocks/footer.scss b/source/styles/blocks/footer.scss new file mode 100644 index 0000000..010ed05 --- /dev/null +++ b/source/styles/blocks/footer.scss @@ -0,0 +1,59 @@ +.footer { + background-color: $color-bg-primary; + min-height: 240px; + padding: 20px 0; + box-sizing: border-box; +} + +.footer__wrapper { + display: flex; + flex-direction: column; + margin: 0 auto; + justify-content: center; +} + +.footer__logo-text { + display: flex; + justify-content: center; + border-bottom: 1px solid $color-accent-3; + padding: 20px 0; + + .logo-text_picture { + width: 128px; + height: 24px; + } +} + +.footer__developer { + margin-top: 20px; +} + +@media (min-width: $tablet-width) { + .footer { + display: flex; + min-height: 147px; + } + + .footer__wrapper { + flex-direction: row; + align-items: center; + } + + .footer__logo-text { + border: none; + margin-right: auto; + width: 170px; + justify-content: start; + } + + .footer__developer { + margin-left: auto; + margin-top: 0; + } +} + +@media (min-width: $desktop-width) { + .footer { + min-height: 169px; + } +} diff --git a/source/styles/blocks/form.scss b/source/styles/blocks/form.scss new file mode 100644 index 0000000..ebd343e --- /dev/null +++ b/source/styles/blocks/form.scss @@ -0,0 +1,21 @@ +.form { + display: flex; + flex-direction: column; + gap: 16px; +} + +@media (min-width: $tablet-width) { + .form { + display: grid; + grid-template-columns: 1fr 256px; + gap: 0; + } +} + +@media (min-width: $desktop-width) { + .form { + gap: 0; + width: 752px; + margin: 0 auto; + } +} diff --git a/source/styles/blocks/header.scss b/source/styles/blocks/header.scss index 797f7c4..8594b71 100644 --- a/source/styles/blocks/header.scss +++ b/source/styles/blocks/header.scss @@ -1,5 +1,47 @@ .header { - background-color: #663399; - color: #ffffff; - padding: 10px 15px; + display: flex; + margin: 0 auto; + align-items: center; + flex-wrap: wrap; + min-height: 65px; +} + +.header__logo-image { + margin-right: 46px; + padding: 5px 10px 5px 0; +} + +.header__logo-text { + display: flex; + align-items: center; + min-height: 65px; +} + +.header__toggle { + margin-left: auto; +} + +@media (min-width: $tablet-width) { + .header { + padding: 18px 0 31px; + flex-wrap: nowrap; + } + + .header__logo-image { + margin-right: 13px; + padding: 5px 0; + } +} + +@media (min-width: $desktop-width) { + .header { + min-height: 59px; + padding-top: 50px; + padding-bottom: 0; + margin-bottom: 24px; + } + + .header__logo-image { + margin-right: 14px; + } } diff --git a/source/styles/blocks/input.scss b/source/styles/blocks/input.scss new file mode 100644 index 0000000..862eda8 --- /dev/null +++ b/source/styles/blocks/input.scss @@ -0,0 +1,28 @@ +.input { + font-family: $font-secondary; + text-transform: uppercase; + font-size: 20px; + line-height: calc(3/2); + color: $text-color-base; + height: 56px; + padding: 12px; + box-sizing: border-box; + border: 1px solid $color-accent-7; + + &:hover { + border-color: $color-accent-4; + } + + &:focus-visible { + border: solid 2px $text-color-base; + } + + &:disabled { + opacity: 0.2; + pointer-events: none; + } + + &:user-invalid { + border: solid 2px $color-accent-error; + } +} diff --git a/source/styles/blocks/intro.scss b/source/styles/blocks/intro.scss new file mode 100644 index 0000000..774a076 --- /dev/null +++ b/source/styles/blocks/intro.scss @@ -0,0 +1,125 @@ +.intro { + font-family: $font-secondary; + background-color: $color-accent-transparent; + background-image: linear-gradient($color-accent-transparent 60%, $color-contrast-text 60%), image-set("../images/intro-bg-licking-cat-mobile@1x.webp" 1x type("image/webp"), "../images/intro-bg-licking-cat-mobile@2x.webp" 2x type("image/webp")), linear-gradient(to right, #4e4d51 50%, #414045 50%); + color: $color-contrast-text; + background-repeat: no-repeat; + background-size: contain, 490px 302px, contain; + background-position: 50% 0; + text-align: center; +} + +.intro__wrapper { + display: flex; + flex-direction: column; + margin: 0 auto; + padding-top: 27px; + padding-bottom: 20px; +} + +.intro__title { + font-size: 36px; + line-height: 1; + font-weight: inherit; +} + +.intro__slogan { + line-height: 1; + text-transform: uppercase; + margin-top: 25px; + margin-bottom: 29px; +} + +.intro__button { + margin-top: 3px; +} + +@media (min-width: $tablet-width) { + .intro { + background-image: none; + background-color: transparent; + } + + .intro__wrapper { + position: relative; + } + + .intro__title { + color: $text-color-accent; + font-size: 60px; + max-width: 420px; + margin-left: 90px; + margin-bottom: 40px; + text-align: start; + } + + .intro__slogan { + color: $text-color-accent; + font-size: 20px; + max-width: 420px; + margin: 0 auto 49px 90px; + text-align: start; + } + + .intro_picture { + z-index: -1; + position: absolute; + bottom: 0; + } + + .intro__button { + max-width: 244px; + margin: 0 0 506px 90px; + font-size: 20px; + line-height: calc(26/20); + padding: 14px 10px; + } +} + +@media (min-width: $desktop-width) { + .intro { + margin-bottom: 88px; + } + + .intro::before { + content: ""; + background-image: linear-gradient($color-accent-transparent, $color-accent-transparent), image-set("../images/intro-bg-licking-cat-desktop@1x.webp" 1x type("image/webp"), "../images/intro-bg-licking-cat-desktop@2x.webp" 2x type("image/webp")), linear-gradient(to right, #403f45, #403f45); + display: block; + width: 50%; + height: 694px; + position: absolute; + top: 0; + z-index: -1; + background-repeat: no-repeat; + margin-left: 720px; + right: 0; + } + + .intro__wrapper { + min-height: 545px; + padding: 0; + } + + .intro__title { + margin-top: 81px; + margin-left: 80px; + } + + .intro__slogan { + margin-left: 80px; + margin-bottom: 52px; + } + + .intro_picture { + height: 499px; + z-index: 1; + top: 0; + left: 447px; + } + + .intro__button { + max-width: 244px; + margin-left: 80px; + margin-bottom: auto; + } +} diff --git a/source/styles/blocks/logo-image.scss b/source/styles/blocks/logo-image.scss new file mode 100644 index 0000000..8dbc9b7 --- /dev/null +++ b/source/styles/blocks/logo-image.scss @@ -0,0 +1,16 @@ +.logo-image { + text-decoration: none; +} + +.logo-image_picture { + display: block; + + &:hover, + &:focus { + opacity: 0.7; + } + + &:active { + opacity: 0.4; + } +} diff --git a/source/styles/blocks/logo-text.scss b/source/styles/blocks/logo-text.scss new file mode 100644 index 0000000..bd52cab --- /dev/null +++ b/source/styles/blocks/logo-text.scss @@ -0,0 +1,21 @@ +.logo-text { + &:hover, + &:focus-visible { + opacity: 0.7; + } + + &:active { + opacity: 0.4; + } +} + +.logo-text_picture { + display: block; +} + +@media (min-width: $desktop-width) { + .logo-text_picture { + width: 118px; + height: 21px; + } +} diff --git a/source/styles/blocks/main.scss b/source/styles/blocks/main.scss new file mode 100644 index 0000000..93060aa --- /dev/null +++ b/source/styles/blocks/main.scss @@ -0,0 +1,3 @@ +.main { + flex-grow: 1; +} diff --git a/source/styles/blocks/map-wrapper.scss b/source/styles/blocks/map-wrapper.scss new file mode 100644 index 0000000..bf1e2b7 --- /dev/null +++ b/source/styles/blocks/map-wrapper.scss @@ -0,0 +1,32 @@ +.map-wrapper { + position: relative; + + :where(iframe) { + position: absolute; + display: block; + border: none; + top: 0; + width: 100%; + height: 362px; + z-index: 1; + } +} + +.map-wrapper__map-reserve-image { + display: block; + margin: 0 auto; +} + +@media (min-width: $tablet-width) { + .map-wrapper { + :where(iframe) { + height: 400px; + } + } +} + +@media (min-width: $desktop-width) { + .map-wrapper { + grid-area: 1 / 1 / -1 / -1; + } +} diff --git a/source/styles/blocks/menu.scss b/source/styles/blocks/menu.scss new file mode 100644 index 0000000..266f43e --- /dev/null +++ b/source/styles/blocks/menu.scss @@ -0,0 +1,61 @@ +.menu { + font-family: $font-secondary; + text-transform: uppercase; + list-style-type: none; + text-align: center; +} + +.menu__item { + border-top: 1px solid $color-accent-2; +} + +.menu__link { + font-size: 20px; + line-height: 1; + color: $text-color-accent; + text-decoration: none; + padding-top: 22px; + padding-bottom: 24px; + display: block; + + &:hover, + &:focus-visible { + opacity: 0.6; + } + + &:active { + opacity: 0.3; + } +} + +@media (min-width: $tablet-width) { + .menu__item { + border: none; + } + + .menu__link { + font-size: 18px; + line-height: calc(24/18); + margin-top: 2px; + height: 24px; + padding: 8px 0; + + &--current { + border-bottom: 2px solid $color-accent; + } + } +} + +@media (min-width: $desktop-width) { + .menu__link { + font-size: 20px; + line-height: 1.5; + margin: 0; + padding: 11px 0; + + &--accent { + color: $color-contrast-text; + border-color: $color-contrast-text; + } + } +} diff --git a/source/styles/blocks/navigation.scss b/source/styles/blocks/navigation.scss new file mode 100644 index 0000000..4e2c9b3 --- /dev/null +++ b/source/styles/blocks/navigation.scss @@ -0,0 +1,58 @@ +.navigation { + border-bottom: 1px solid $color-accent-2; + min-width: 100%; + + &--open { + position: absolute; + top: 65px; + right: 0; + left: 0; + } + + &--close { + display: none; + } + + &--nojs { + position: static; + } +} + +.navigation__list { + padding: 0; + margin: 0 auto; + background-color: #ffffff; + width: 100%; +} + +@media (min-width: $tablet-width) { + .navigation { + margin-left: auto; + position: static; + min-width: auto; + max-width: 500px; + border: none; + + &--close { + display: block; + } + } + + .navigation__list { + display: flex; + flex-wrap: wrap; + gap: 34px; + padding-right: 5px; + } + + .navigation__toggle { + display: none; + } +} + +@media (min-width: $desktop-width) { + .navigation__list { + padding: 0; + background-color: transparent; + } +} diff --git a/source/styles/blocks/page.scss b/source/styles/blocks/page.scss new file mode 100644 index 0000000..e0ceefd --- /dev/null +++ b/source/styles/blocks/page.scss @@ -0,0 +1,13 @@ +.page__body { + margin: 0; + + :where(h1,h2,h3) { + font-family: $font-secondary; + font-weight: 400; + margin: 0; + } + + :where(picture,source) { + display: contents; + } +} diff --git a/source/styles/blocks/programs.scss b/source/styles/blocks/programs.scss new file mode 100644 index 0000000..6b99c36 --- /dev/null +++ b/source/styles/blocks/programs.scss @@ -0,0 +1,228 @@ +.programs { + margin-bottom: 21px; +} + +.programs__list { + display: flex; + gap: 21px; + flex-direction: column; + list-style-type: none; + margin: 0 auto; + padding: 0; +} + +.programs__item { + background-color: $color-bg-primary; + padding: 30px 20px 13px; +} + +.programs__title { + position: relative; + display: flex; + font-size: 24px; + line-height: calc(37/24); + text-transform: uppercase; + color: $text-color-accent; + padding-left: 70px; +} + +.programs__title::before { + content: ""; + background-repeat: no-repeat; + display: block; + position: absolute; + align-self: center; +} + +.programs__title--slim::before { + background-image: url("../../icons/stack.svg#icon-cat-slim"); + background-size: 50px 53px; + width: 50px; + height: 53px; + left: 0; +} + +.programs__title--pro::before { + background-image: url("../../icons/stack.svg#icon-cat-pro"); + background-size: 68px 50px; + width: 68px; + height: 50px; + left: -9px; + top: -6px; + z-index: 2; +} + +.programs__description { + margin: 29px 0 10px; +} + +.programs__description::after { + content: ""; + display: block; + width: 100%; + height: 1px; + background-color: $color-accent-3; + margin-top: 23px; +} + +.programs__button { + display: flex; + flex-wrap: wrap; + align-items: center; + font-family: $font-secondary; + font-size: 16px; + line-height: 1; + text-transform: uppercase; + text-decoration: none; + color: $text-color-accent; + width: fit-content; + min-height: 24px; + box-sizing: border-box; + padding: 8px 0; + + &:active { + opacity: 0.3; + } + + &focus-visible { + opacity: 0.6; + } + + &::after { + content: ""; + align-self: center; + background-color: $text-color-accent; + mask-image: url("../../icons/stack.svg#icon-arrow-right"); + mask-repeat: no-repeat; + mask-size: 32px 12px; + mask-position: -6px; + width: 32px; + height: 12px; + display: block; + cursor: pointer; + margin-left: 15px; + } + + &:is(:hover, :active, :focus-visible)::after { + mask-position: 0; + } +} + +@media (min-width: $tablet-width) { + .programs { + margin-bottom: 44px; + } + + .programs__list { + gap: 29px; + } + + .programs__item { + position: relative; + display: grid; + grid-template-rows: repeat(3, auto); + grid-template-columns: 340px 1fr; + gap: 24px 10px; + padding: 77px 29px 53px 52px; + } + + .programs__title { + position: static; + font-size: 36px; + line-height: 1; + padding-left: 1px; + + &::before { + right: 0; + grid-area: 1/2/-1/3; + justify-self: end; + } + + &--slim::before { + top: 4px; + right: 34px; + background-size: 200px 211px; + width: 200px; + height: 211px; + } + + &--pro::before { + top: 14px; + background-size: 268px 200px; + width: 268px; + height: 200px; + right: 4px; + } + } + + .programs__description { + font-size: 16px; + line-height: 1.5; + color: $text-color-accent; + margin: 0; + grid-row: 2/3; + + &::after { + display: none; + } + } + + .programs__button { + grid-row: 3/4; + margin-top: 25px; + min-height: 38px; + font-size: 20px; + line-height: 1.5; + padding: 4px 0; + + &::after { + margin-left: 24px; + } + } +} + +@media (min-width: $desktop-width) { + .programs { + margin-bottom: 71px; + } + + .programs__list { + display: grid; + grid-template-columns: repeat(2, 570px); + gap: 80px; + } + + .programs__item { + display: block; + padding: 77px 65px 55px 52px; + } + + .programs__title { + padding-left: 162px; + margin-bottom: 73px; + + &::before { + justify-self: start; + } + + &--slim::before { + width: 100px; + height: 106px; + background-size: 100px 106px; + left: 52px; + top: 41px; + } + + &--pro::before { + width: 134px; + height: 100px; + background-size: 134px 100px; + left: 33px; + top: 47px; + } + } + + .programs__button { + margin-top: 23px; + } +} diff --git a/source/styles/blocks/promo.scss b/source/styles/blocks/promo.scss new file mode 100644 index 0000000..dd40bc7 --- /dev/null +++ b/source/styles/blocks/promo.scss @@ -0,0 +1,77 @@ +.promo { + background-image: linear-gradient($color-accent-transparent 50% 50%), image-set("../images/bg-promo-mobile@1x.webp" 1x type("image/webp"), "../images/bg-promo-mobile@2x.webp" 2x type("image/webp")); + background-size: cover; + color: $color-contrast-text; + min-height: 290px; + padding-top: 59px; + padding-bottom: 43px; + box-sizing: border-box; +} + +.promo__text { + display: flex; + flex-direction: column; + font-size: 16px; + line-height: calc(20/16); + margin: 0 auto; + align-items: center; + width: 161px; + text-align: center; + + &::before { + content: ""; + background-image: url("../../icons/stack.svg#icon-promo-gift"); + background-size: 78px 80px; + background-repeat: no-repeat; + width: 78px; + height: 80px; + display: block; + margin-bottom: 48px; + } +} + +@media (min-width: $tablet-width) { + .promo { + background-image: linear-gradient($color-accent-transparent 50% 50%), image-set("../images/bg-promo-tablet@1x.webp" 1x type("image/webp"), "../images/bg-promo-tablet@2x.webp" 2x type("image/webp")); + min-height: 200px; + padding: 61px 125px 60px 78px; + } + + .promo__text { + display: grid; + grid-template-columns: 1fr 161px; + margin: 0; + text-align: start; + width: 100%; + + &::before { + margin: -3px 264px 0 0; + } + } +} + +@media (min-width: $desktop-width) { + .promo { + background-image: linear-gradient($color-accent-transparent 50% 50%), image-set("../images/bg-promo-desktop@1x.webp" 1x type("image/webp"), "../images/bg-promo-desktop@2x.webp" 2x type("image/webp")); + width: 245px; + padding: 56px 42px 43px; + } + + .promo__text { + display: flex; + flex-direction: column; + font-size: 16px; + line-height: calc(20/16); + margin: 0 auto; + align-items: center; + width: 161px; + text-align: center; + + &::before { + background-size: 80px 83px; + width: 80px; + height: 83px; + margin: 0 auto 46px; + } + } +} diff --git a/source/styles/blocks/slider.scss b/source/styles/blocks/slider.scss new file mode 100644 index 0000000..3bdebfa --- /dev/null +++ b/source/styles/blocks/slider.scss @@ -0,0 +1,71 @@ +.slider { + display: grid; + --range: 0.5; + grid-template-columns: calc(var(--range) * 100%) auto calc((1 - var(--range)) * 100%); + aspect-ratio: 280 / 256; + width: min(100%, 560px); +} + +.slider__image { + object-fit: cover; + width: 100%; + height: 100%; + display: block; + + &--before { + object-position: left; + } + + &--after { + object-position: right; + } +} + +.slider__range { + display: grid; + z-index: 1; + color: $text-color-accent-3; + cursor: col-resize; + background-color: currentColor; + border-radius: 2px; + place-items: center; + width: 4px; + height: 100%; + margin: 0 -2px; + transition: color 0.2s, opacity 0.2s; + + &:hover, + &:focus-visible { + color: $color-accent; + } + + &:active { + opacity: 0.6; + } +} + +.slider__button { + box-sizing: border-box; + display: grid; + margin: -18px; + width: 40px; + height: 40px; + color: inherit; + border: 2px solid currentColor; + border-radius: 20px; + background-color: $color-contrast-text; + cursor: col-resize; + + &::before { + display: block; + content: ""; + width: 100%; + height: 100%; + background-color: currentColor; + mask-image: url("../../icons/stack.svg#button-slider"); + } + + &:focus-visible::before { + color: $color-accent; + } +} diff --git a/source/styles/blocks/social.scss b/source/styles/blocks/social.scss new file mode 100644 index 0000000..bb73572 --- /dev/null +++ b/source/styles/blocks/social.scss @@ -0,0 +1,56 @@ +.social__list { + display: flex; + list-style-type: none; + margin: 0 auto; + flex-wrap: wrap; + padding: 7px 0; + justify-content: center; + border-bottom: 1px solid $color-accent-3; +} + +.social__link { + text-decoration: none; + border: none; + display: block; + cursor: pointer; + padding: 12px; + + &::before { + display: block; + content: ""; + width: 28px; + height: 22px; + background-color: $text-color-accent-3; + mask-position: 50%; + mask-size: 28px 22px; + mask-repeat: no-repeat; + } + + &--vkontakte::before { + mask-image: url("../../icons/stack.svg#icon-vkontakte"); + } + + &--youtube::before { + mask-image: url("../../icons/stack.svg#icon-youtube"); + } + + &--telegram::before { + mask-image: url("../../icons/stack.svg#icon-telegram"); + } + + &:hover::before, + &:focus-visible::before { + background-color: $color-accent; + } + + &:active::before { + background-color: $color-accent; + opacity: 0.3; + } +} + +@media (min-width: $tablet-width) { + .social__list { + border: none; + } +} diff --git a/source/styles/blocks/stats.scss b/source/styles/blocks/stats.scss new file mode 100644 index 0000000..829689c --- /dev/null +++ b/source/styles/blocks/stats.scss @@ -0,0 +1,199 @@ +.stats { + background-color: $color-bg-secondary; +} + +.stats__wrapper { + margin: 0 auto; + padding: 25px 0 40px; +} + +.stats__title { + font-size: 36px; + line-height: calc(40/36); + color: $text-color-accent; + margin-bottom: 40px; +} + +.stats__description { + margin: 0 0 20px; +} + +.stats__list { + display: grid; + grid-template-columns: repeat(2, 124px); + gap: 19px 32px; + margin: 0 0 20px; +} + +.stats__item { + display: flex; + flex-direction: column; + align-items: center; +} + +.stats__term { + font-size: 12px; + line-height: 1; + text-transform: lowercase; + order: 1; + width: 87px; + text-align: center; + margin-top: -9px; + background-color: $color-bg-secondary; + padding: 0 5px; + box-sizing: border-box; +} + +.stats__number { + font-family: $font-secondary; + font-size: 24px; + line-height: 1; + text-transform: uppercase; + color: $text-color-accent; + margin: 0; + padding: 13px 5px 17px; + box-sizing: border-box; + width: 100%; + text-align: center; + border: 1px solid $color-accent-4; + border-radius: 3px; +} + +.stats__item-up { + grid-column: 1/-1; + flex-flow: wrap; + font-family: $font-secondary; + font-size: 14px; + line-height: calc(20/14); + text-transform: uppercase; + color: $text-color-accent; + margin: 0 auto; + gap: 4px; +} + +.stats__term-up { + font-size: inherit; + line-height: inherit; + text-transform: inherit; + color: inherit; +} + +.stats__number-up { + font-size: inherit; + line-height: inherit; + text-transform: inherit; + color: inherit; + margin: 0; +} + +.stats__slider { + margin: 0 auto; +} + +@media (min-width: $tablet-width) { + .stats { + border-top: 1px solid $color-accent-2; + background-color: transparent; + background-image: linear-gradient(to top, $color-bg-secondary 462px, $color-contrast-text 462px); + } + + .stats__wrapper { + padding: 45px 0 101px; + } + + .stats__title { + font-size: 60px; + line-height: 1; + margin-bottom: 60px; + } + + .stats__description { + font-size: 16px; + line-height: 1.5; + margin-bottom: 55px; + } + + .stats__list { + display: flex; + margin-bottom: 99px; + gap: 43px; + } + + .stats__item { + width: 162px; + } + + .stats__number { + font-size: 30px; + line-height: calc(37/30); + padding: 15px 5px 19px; + } + + .stats__term { + font-size: inherit; + line-height: 1; + max-width: 145px; + width: fit-content; + padding: 0 9px; + background-color: $color-contrast-text; + } + + .stats__item-up { + flex-direction: column; + font-size: 20px; + line-height: 1; + gap: 9px; + align-items: end; + margin: 11px 0 auto auto; + width: fit-content; + max-width: 250px; + } +} + +@media (min-width: $desktop-width) { + .stats { + border: none; + background-image: linear-gradient($color-contrast-text 136px, $color-bg-secondary 136px); + } + + .stats__wrapper { + position: relative; + padding: 0; + padding-bottom: 75px; + } + + .stats__title { + margin-bottom: 146px; + } + + .stats__description { + margin-bottom: 69px; + width: 436px; + } + + .stats__term { + background-color: $color-bg-secondary; + } + + .stats__list { + grid-template-columns: repeat(2, 162px); + gap: 55px 42px; + display: grid; + margin: 0; + width: fit-content; + } + + .stats__item-up { + margin: 0; + flex-direction: row; + max-width: 100%; + gap: 63px; + } + + .stats__slider { + position: absolute; + margin: 0; + top: 0; + right: 0; + } +} diff --git a/source/styles/blocks/sub-card.scss b/source/styles/blocks/sub-card.scss new file mode 100644 index 0000000..475a64a --- /dev/null +++ b/source/styles/blocks/sub-card.scss @@ -0,0 +1,93 @@ +.sub-card { + display: flex; + flex-direction: column; + padding: 12px 0 18px; + border-top: 1px solid $color-accent-4; + + &:last-child { + border-bottom: 1px solid $color-accent-4; + } +} + +.sub-card__title { + font-size: 16px; + line-height: 1; + text-transform: uppercase; + color: $text-color-accent-4; +} + +.sub-card__characteristic { + display: flex; + justify-content: space-between; + font-size: 14px; + line-height: 1; + margin: 13px 0 15px; +} + +.sub-card__characteristic-number { + margin: 0; + max-width: 50%; +} + +@media (min-width: $tablet-width) { + .sub-card { + display: grid; + grid-template-columns: repeat(2, 50%); + row-gap: 21px; + font-size: 32px; + line-height: 1; + padding: 26px 38px 28px; + border-left: 1px solid $color-accent-4; + border-right: 1px solid $color-accent-4; + } + + .sub-card__title { + font-size: 20px; + line-height: 1; + } + + .sub-card__characteristic { + font-size: 16px; + line-height: calc(20/16); + margin: 3px 0 0; + justify-content: end; + text-align: end; + } + + .sub-card__characteristic-number { + min-width: 93px; + } + + .sub-card__button { + grid-column: 1/3; + } +} + +@media (min-width: $desktop-width) { + .sub-card { + grid-template-columns: 316px auto 244px; + border-right: none; + border-left: none; + padding: 15px 0 16px; + width: 896px; + align-items: center; + gap: 10px; + } + + .sub-card__characteristic { + display: grid; + grid-template-columns: 233px 1fr; + gap: 10px; + text-align: start; + } + + .sub-card__characteristic-number { + margin: 0; + min-width: fit-content; + max-width: max-content; + } + + .sub-card__button { + grid-column: 3/4; + } +} diff --git a/source/styles/blocks/sub-product.scss b/source/styles/blocks/sub-product.scss new file mode 100644 index 0000000..681abb4 --- /dev/null +++ b/source/styles/blocks/sub-product.scss @@ -0,0 +1,58 @@ +.sub-product { + margin-bottom: 40px; +} + +.sub-product__title { + font-size: 24px; + line-height: 1; + color: $text-color-accent; + margin-bottom: 36px; +} + +.sub-product__list { + list-style-type: none; + padding: 0; + margin: 0; + margin-bottom: 37px; +} + +@media (min-width: $tablet-width) { + .sub-product { + margin-bottom: 80px; + } + + .sub-product__title { + font-size: 32px; + line-height: 1; + margin-bottom: 80px; + margin-left: 40px; + } + + .sub-product__list { + margin-bottom: 69px; + } +} + +@media (min-width: $desktop-width) { + .sub-product { + margin-bottom: 96px; + } + + .sub-product__title { + font-size: 40px; + line-height: 1; + margin-left: 0; + } + + .sub-product__container { + display: flex; + } + + .sub-product__list { + margin-bottom: 0; + } + + .sub-product__promo { + margin-left: auto; + } +} diff --git a/source/styles/blocks/subscribe.scss b/source/styles/blocks/subscribe.scss new file mode 100644 index 0000000..c0dda30 --- /dev/null +++ b/source/styles/blocks/subscribe.scss @@ -0,0 +1,55 @@ +.subscribe { + font-family: $font-secondary; + color: $text-color-accent; + margin-bottom: 40px; +} + +.subscribe__title { + font-size: 24px; + line-height: 1; + margin-bottom: 32px; +} + +.subscribe__text { + font-size: 16px; + line-height: calc(24/16); + margin: 24px; + text-align: center; +} + +.subscribe__button { + padding: 15px 10px; +} + +@media (min-width: $tablet-width) { + .subscribe { + padding: 0 40px; + box-sizing: border-box; + margin-bottom: 80px; + } + + .subscribe__title { + font-size: 32px; + line-height: 1; + margin-bottom: 66px; + } + + .subscribe__text { + font-size: 24px; + line-height: calc(32/24); + margin: 0 50px 24px; + } +} + +@media (min-width: $desktop-width) { + .subscribe { + padding: 0; + margin-bottom: 104px; + } + + .subscribe__title { + font-size: 40px; + line-height: 1; + margin-bottom: 72px; + } +} diff --git a/source/styles/blocks/wrapper.scss b/source/styles/blocks/wrapper.scss new file mode 100644 index 0000000..88ce33e --- /dev/null +++ b/source/styles/blocks/wrapper.scss @@ -0,0 +1,16 @@ +.wrapper { + width: 280px; + margin: 0 auto; +} + +@media (min-width: $tablet-width) { + .wrapper { + width: calc($tablet-width - 60px); + } +} + +@media (min-width: $desktop-width) { + .wrapper { + width: calc($desktop-width - 220px); + } +} diff --git a/source/styles/common/fonts.scss b/source/styles/common/fonts.scss index 6bb897d..0f5ef3e 100644 --- a/source/styles/common/fonts.scss +++ b/source/styles/common/fonts.scss @@ -1 +1,2 @@ -/* здесь подключите шрифты */ +@include font-face ("Lato", 400, normal, url("../../fonts/lato/Lato-Regular.woff2") format("woff2")); +@include font-face ("Oswald", 400, normal, url("../../fonts/oswald/oswaldregular.woff2") format("woff2")); diff --git a/source/styles/common/global.scss b/source/styles/common/global.scss index ac721bd..de9704c 100644 --- a/source/styles/common/global.scss +++ b/source/styles/common/global.scss @@ -1 +1,10 @@ -/* здесь используйте глобальные селекторы img, body, html и так далее */ +body { + display: flex; + flex-direction: column; + font-family: $font-primary; + background-color: $color-contrast-text; + color: $text-color-base; + font-size: 14px; + line-height: calc(18/14); + min-height: 100vh; +} diff --git a/source/styles/common/mixins.scss b/source/styles/common/mixins.scss new file mode 100644 index 0000000..0d5691f --- /dev/null +++ b/source/styles/common/mixins.scss @@ -0,0 +1,9 @@ +@mixin font-face ($font-family, $font-weight, $font-style, $font-src) { + @font-face { + font-family: $font-family; + font-weight: $font-weight; + font-style: $font-style; + src: $font-src; + font-display: swap; + } +} diff --git a/source/styles/common/variables.scss b/source/styles/common/variables.scss index 8bcd34b..d13bdae 100644 --- a/source/styles/common/variables.scss +++ b/source/styles/common/variables.scss @@ -1 +1,24 @@ -/* здесь используйте глобальные переменные */ +$font-primary: "Lato", "Arial", sans-serif; +$font-secondary: "Oswald", "Arial", sans-serif; + +$text-color-base: #444444; +$text-color-accent: #000000; +$text-color-accent-2: #111111; +$text-color-accent-3: #666666; +$text-color-accent-4: #222222; + +$color-accent: #68b738; +$color-accent-transparent: rgba($color-accent, 0.85); +$color-accent-2: #e6e6e6; +$color-accent-3: #d9d9d9; +$color-accent-4: #cdcdcd; +$color-accent-5: #ebebeb; +$color-accent-6: #5eaa2f; +$color-accent-7: #e7e7e7; +$color-contrast-text: #ffffff; +$color-bg-primary: #f2f2f2; +$color-bg-secondary: #eaeaea; +$color-accent-error: #ff8282; + +$tablet-width: 768px; +$desktop-width: 1440px; diff --git a/source/styles/common/visually-hidden.scss b/source/styles/common/visually-hidden.scss new file mode 100644 index 0000000..927315d --- /dev/null +++ b/source/styles/common/visually-hidden.scss @@ -0,0 +1,4 @@ +.visually-hidden { + position: fixed; + transform: scale(0); +} diff --git a/source/styles/styles.scss b/source/styles/styles.scss index 7610188..10f7843 100644 --- a/source/styles/styles.scss +++ b/source/styles/styles.scss @@ -1,7 +1,39 @@ /* GLOBAL */ @import "./common/variables.scss"; -@import "./common/global.scss"; +@import "./common/mixins.scss"; @import "./common/fonts.scss"; +@import "./common/global.scss"; +@import "./common/visually-hidden.scss"; + /* BLOCKS */ +@import "./blocks/wrapper.scss"; +@import "./blocks/page.scss"; +@import "./blocks/button.scss"; +@import "./blocks/accent-line.scss"; @import "./blocks/header.scss"; +@import "./blocks/logo-image.scss"; +@import "./blocks/logo-text.scss"; +@import "./blocks/navigation.scss"; +@import "./blocks/button-toggle.scss"; +@import "./blocks/menu.scss"; +@import "./blocks/main.scss"; +@import "./blocks/intro.scss"; +@import "./blocks/programs.scss"; +@import "./blocks/advantages.scss"; +@import "./blocks/stats.scss"; +@import "./blocks/slider.scss"; +@import "./blocks/address.scss"; +@import "./blocks/map-wrapper.scss"; +@import "./blocks/footer.scss"; +@import "./blocks/social.scss"; +@import "./blocks/developer.scss"; +@import "./blocks/catalog.scss"; +@import "./blocks/card.scss"; +@import "./blocks/card-more.scss"; +@import "./blocks/sub-product.scss"; +@import "./blocks/sub-card.scss"; +@import "./blocks/promo.scss"; +@import "./blocks/subscribe.scss"; +@import "./blocks/form.scss"; +@import "./blocks/input.scss";