Merge pull request #2 from konick24/modul2-task1

Modul2 task1
htmlacademy-adaptive · Dec 25, 2024 · 51643b0 · 51643b0
2 parents 425dd62 + 02e04e7
commit 51643b0
Show file tree

Hide file tree

Showing 3 changed files with 399 additions and 11 deletions.
diff --git a/Readme.md b/Readme.md
@@ -1,7 +1,7 @@
 # Личный проект «Кэт энерджи»
 
 * Студент: [Артём Корякин](https://up.htmlacademy.ru/adaptive-individual/2/user/2312385).
-* Наставник: `Неизвестно`.
+* Наставник: [Виктория Никитина](https://github.com/vikitina).
 
 ---
 

diff --git a/source/catalog.html b/source/catalog.html
@@ -0,0 +1,254 @@
+<!DOCTYPE html>
+<html class="page" lang="ru">
+
+<head>
+  <meta charset="UTF-8">
+  <title>Cat-Energy</title>
+  <meta name="viewport" content="width=device-width,initial-scale=1">
+  <link rel="stylesheet" href="styles/styles.css">
+  <script src="scripts/index.js" defer></script>
+</head>
+
+<body class="page__body">
+  <header class="page-header">
+    <a class="page-header__logo logo" href="#">
+      <picture>
+        <img class="logo__icon" src="#" width="33" height="38" alt="Логотип сайта Cat-Energy">
+      </picture>
+    </a>
+    <nav class="page-header__nav">
+      <button class="page-header__button" type="button">
+        <span class="visually-hidden">Открыть меню сайта</span>
+      </button>
+      <ul class="page-header__list site-list">
+        <li class="site-list__item">
+          <a class="site-list__link" href="./index.html">Главная</a>
+        </li>
+        <li class="site-list__item">
+          <a class="site-list__link" href="#">Каталог продукции</a>
+        </li>
+        <li class="site-list__item">
+          <a class="site-list__link" href="#">Подбор программы</a>
+        </li>
+      </ul>
+    </nav>
+  </header>
+  <main class="page-main">
+    <h1 class="page-main__heading">Каталог продукции</h1>
+    <section class="page-main__section catalog">
+      <h2 class="visually-hidden">Список продукции</h2>
+      <ul class="catalog__list">
+        <li class="catalog__item product">
+          <img class="product__pic" src="#" width="68" height="86" alt="">
+          <h3 class="product__title">Cat Energy PRO 500 г</h3>
+          <dl class="product__list">
+            <dt class="product__term">Масса</dt>
+            <dd class="product__text">500 г</dd>
+
+            <dt class="product__term">Вкус</dt>
+            <dd class="product__text">Курица</dd>
+
+            <dt class="product__term">Цена</dt>
+            <dd class="product__text">700 ₽</dd>
+          </dl>
+          <a class="product__button button" href="#">Заказать</a>
+        </li>
+        <li class="catalog__item product">
+          <img class="product__pic" src="#" width="68" height="86" alt="">
+          <h3 class="product__title">Cat Energy PRO 1000 г</h3>
+          <dl class="product__list">
+            <dt class="product__term">Масса</dt>
+            <dd class="product__text">1000 г</dd>
+
+            <dt class="product__term">Вкус</dt>
+            <dd class="product__text">Курица</dd>
+
+            <dt class="product__term">Цена</dt>
+            <dd class="product__text">1000 ₽</dd>
+          </dl>
+          <a class="product__button button" href="#">Заказать</a>
+        </li>
+        <li class="catalog__item product">
+          <img class="product__pic" src="#" width="68" height="86" alt="">
+          <h3 class="product__title">Cat Energy PRO 500 г</h3>
+          <dl class="product__list">
+            <dt class="product__term">Масса</dt>
+            <dd class="product__text">500 г</dd>
+
+            <dt class="product__term">Вкус</dt>
+            <dd class="product__text">Рыба</dd>
+
+            <dt class="product__term">Цена</dt>
+            <dd class="product__text">700 ₽</dd>
+          </dl>
+          <a class="product__button button" href="#">Заказать</a>
+        </li>
+        <li class="catalog__item product">
+          <img class="product__pic" src="#" width="68" height="86" alt="">
+          <h3 class="product__title">Cat Energy PRO 1000 г</h3>
+          <dl class="product__list">
+            <dt class="product__term">Масса</dt>
+            <dd class="product__text">1000 г</dd>
+
+            <dt class="product__term">Вкус</dt>
+            <dd class="product__text">Рыба</dd>
+
+            <dt class="product__term">Цена</dt>
+            <dd class="product__text">1000 ₽</dd>
+          </dl>
+          <a class="product__button button" href="#">Заказать</a>
+        </li>
+        <li class="catalog__item product">
+          <img class="product__pic" src="#" width="68" height="86" alt="">
+          <h3 class="product__title">Cat Energy slim 500 г</h3>
+          <dl class="product__list">
+            <dt class="product__term">Масса</dt>
+            <dd class="product__text">500 г</dd>
+
+            <dt class="product__term">Вкус</dt>
+            <dd class="product__text">Гречка</dd>
+
+            <dt class="product__term">Цена</dt>
+            <dd class="product__text">400 ₽</dd>
+          </dl>
+          <a class="product__button button" href="#">Заказать</a>
+        </li>
+        <li class="catalog__item product">
+          <img class="product__pic" src="#" width="68" height="86" alt="">
+          <h3 class="product__title">Cat Energy slim 1000 г</h3>
+          <dl class="product__list">
+            <dt class="product__term">Масса</dt>
+            <dd class="product__text">1000 г</dd>
+
+            <dt class="product__term">Вкус</dt>
+            <dd class="product__text">Гречка</dd>
+
+            <dt class="product__term">Цена</dt>
+            <dd class="product__text">700 ₽</dd>
+          </dl>
+          <a class="product__button button" href="#">Заказать</a>
+        </li>
+        <li class="catalog__item product">
+          <img class="product__pic" src="#" width="68" height="86" alt="">
+          <h3 class="product__title">Cat Energy slim 500 г</h3>
+          <dl class="product__list">
+            <dt class="product__term">Масса</dt>
+            <dd class="product__text">500 г</dd>
+
+            <dt class="product__term">Вкус</dt>
+            <dd class="product__text">Рис</dd>
+
+            <dt class="product__term">Цена</dt>
+            <dd class="product__text">500 ₽</dd>
+          </dl>
+          <a class="product__button button" href="#">Заказать</a>
+        </li>
+        <li class="catalog__item show-more">
+          <p class="show-more__title">Показать еще 100500 товаров</p>
+          <p class="show-more__text">На самом деле вкусов гораздо больше!</p>
+          <a class="show-more__button button" href="#">показать все</a>
+        </li>
+      </ul>
+    </section>
+    <section class="page-main__section additionally">
+      <h2 class="additionally__heading">Дополнительные товары</h2>
+      <ul class="additionally__list">
+        <li class="additionally__item additionally-item">
+          <h3 class="additionally-item__title">Сахарозаменитель</h3>
+          <dl class="additionally-item__list">
+            <dt class="visually-hidden">Объём</dt>
+            <dd class="additionally-item__text">1 упаковка (100 г)</dd>
+
+            <dt class="visually-hidden">Цена</dt>
+            <dd class="additionally-item__text">200 Р.</dd>
+          </dl>
+        </li>
+        <li class="additionally__item additionally-item">
+          <h3 class="additionally-item__title">Питьевая вода</h3>
+          <dl class="additionally-item__list">
+            <dt class="visually-hidden">Объём</dt>
+            <dd class="additionally-item__text">5 литров</dd>
+
+            <dt class="visually-hidden">Цена</dt>
+            <dd class="additionally-item__text">50 Р.</dd>
+          </dl>
+        </li>
+        <li class="additionally__item additionally-item">
+          <h3 class="additionally-item__title">Молоко</h3>
+          <dl class="additionally-item__list">
+            <dt class="visually-hidden">Объём</dt>
+            <dd class="additionally-item__text">1 литр</dd>
+
+            <dt class="visually-hidden">Цена</dt>
+            <dd class="additionally-item__text">100 Р.</dd>
+          </dl>
+        </li>
+        <li class="additionally__item additionally-item">
+          <h3 class="additionally-item__title">Витамины</h3>
+          <dl class="additionally-item__list">
+            <dt class="visually-hidden">Объём</dt>
+            <dd class="additionally-item__text">1 упаковка (30 г)</dd>
+
+            <dt class="visually-hidden">Цена</dt>
+            <dd class="additionally-item__text">300 Р.</dd>
+          </dl>
+        </li>
+      </ul>
+      <div class="additionally__offer offer">
+        <h2 class="visually-hidden">Специальное предложение</h2>
+        <p class="offer__text">
+          Закажите все и получите чехол для кота в подарок!
+        </p>
+      </div>
+    </section>
+    <section class="page-main__section stocks">
+      <h2 class="stocks__heading">Акции и новинки</h2>
+      <p class="stocks__text">
+        Подпишитесь на наши новости и не пропустите ни одного предложения!
+      </p>
+      <form class="stocks__form stocks-form" method="post" action="#">
+        <label class="visually-hidden" for="user-email">Ваш e-mail</label>
+        <input class="stocks-form__input" type="email" name="user-email" id="user-email" placeholder="[email protected]" required>
+        <button class="stocks-form__button button" type="submit">Подписаться</button>
+      </form>
+    </section>
+  </main>
+  <footer class="page-footer">
+    <section class="page-footer__section contacts">
+      <h2 class="visually-hidden">Контакты</h2>
+      <p class="contacts__title">
+        Приглашаем к сотрудничеству дилеров!
+      </p>
+      <p class="contacts__text">
+        <span class="contacts__street">ул. Большая Конюшенная, д. 19/8</span>
+        <span class="contacts__city">Санкт-Петербург</span>
+      </p>
+    </section>
+    <section class="page-footer__section social">
+      <h2 class="visually-hidden">Социальные сети</h2>
+      <ul class="social__list">
+        <li class="social__item">
+          <a class="social__link" href="#">
+            <span class="visually-hidden">Вконтакте</span>
+          </a>
+        </li>
+        <li class="social__item">
+          <a class="social__link" href="#">
+            <span class="visually-hidden">YouTube</span>
+          </a>
+        </li>
+        <li class="social__item">
+          <a class="social__link" href="#">
+            <span class="visually-hidden">Телеграм</span>
+          </a>
+        </li>
+      </ul>
+      <a class="page-footer__copyright copyright" href="#">
+        <span class="visually-hidden">Разработано в</span>
+        HTML Academy
+      </a>
+    </section>
+  </footer>
+</body>
+
+</html>