-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
IrinaRogacheva
authored and
IrinaRogacheva
committed
Dec 16, 2024
1 parent
4bb2dae
commit 59afaf7
Showing
16 changed files
with
685 additions
and
11 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,301 @@ | ||
<!DOCTYPE html> | ||
<html class="page" lang="ru"> | ||
<head> | ||
<meta charset="utf-8"> | ||
<title>HTML Academy: Кэт энерджи</title> | ||
</head> | ||
<body class="page__body"> | ||
<header class="main-header"> | ||
<a class="main-header__logo logo"> | ||
<img src="img/logo-mobile.svg" width="33" height="38" | ||
alt="Функциональное питание для котов «Cat Energy»."> | ||
</a> | ||
<nav class="main-nav"> | ||
<button class="main-nav__toggle" type="button"> | ||
<span class="visually-hidden">Открыть меню</span> | ||
</button> | ||
<div class="main-nav__wrapper"> | ||
<ul class="main-nav__list"> | ||
<li class="site-list__item"> | ||
<a> | ||
Главная | ||
</a> | ||
</li> | ||
<li class="site-list__item site-list__item--active"> | ||
<a href="catalog.html"> | ||
Каталог продукции | ||
</a> | ||
</li> | ||
<li class="site-list__item"> | ||
<a href="form.html"> | ||
Подбор программы | ||
</a> | ||
</li> | ||
</ul> | ||
</div> | ||
</nav> | ||
</header> | ||
<main class="main-container"> | ||
<section class="product"> | ||
<div class="product__wrapper"> | ||
<h1 class="product__title title">Каталог продукции</h1> | ||
<ul class="product__list"> | ||
<li class="product__list-item"> | ||
<a class="product__image-link" href="#"> | ||
<img class="product__image" src="img/catalog/cat-energy-pro-chicken-500.png" | ||
width="68" height="86" alt="Cat Energy PRO Курица 500 г"> | ||
</a> | ||
<div class="product__card"> | ||
<a href="#"> | ||
<h2 class="product__card-title">Cat Energy PRO 500 г</h2> | ||
</a> | ||
<dl class="product__card-list"> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Масса</dt> | ||
<dd class="product__card-description">500 г</dd> | ||
</div> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Вкус</dt> | ||
<dd class="product__card-description">Курица</dd> | ||
</div> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Цена</dt> | ||
<dd class="product__card-description">700 ₽</dd> | ||
</div> | ||
</dl> | ||
</div> | ||
<button class="product__button button" type="button">Заказать</button> | ||
</li> | ||
<li class="product__list-item"> | ||
<a class="product__image-link" href="#"> | ||
<img class="product__image" src="img/catalog/cat-energy-pro-chicken-1000.png" | ||
width="84" height="100" alt="Cat Energy PRO Курица 1000 г"> | ||
</a> | ||
<div class="product__card"> | ||
<a href="#"> | ||
<h2 class="product__card-title">Cat Energy PRO 1000 г</h2> | ||
</a> | ||
<dl class="product__card-list"> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Масса</dt> | ||
<dd class="product__card-description">1000 г</dd> | ||
</div> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Вкус</dt> | ||
<dd class="product__card-description">Курица</dd> | ||
</div> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Цена</dt> | ||
<dd class="product__card-description">1000 ₽</dd> | ||
</div> | ||
</dl> | ||
</div> | ||
<button class="product__button button" type="button">Заказать</button> | ||
</li> | ||
<li class="product__list-item"> | ||
<a class="product__image-link" href="#"> | ||
<img class="product__image" src="img/catalog/cat-energy-pro-fish-500.png" | ||
width="68" height="78" alt="Cat Energy PRO Рыба 500 г"> | ||
</a> | ||
<div class="product__card"> | ||
<a href="#"> | ||
<h2 class="product__card-title">Cat Energy PRO 500 г</h2> | ||
</a> | ||
<dl class="product__card-list"> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Масса</dt> | ||
<dd class="product__card-description">500 г</dd> | ||
</div> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Вкус</dt> | ||
<dd class="product__card-description">Рыба</dd> | ||
</div> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Цена</dt> | ||
<dd class="product__card-description">700 ₽</dd> | ||
</div> | ||
</dl> | ||
</div> | ||
<button class="product__button button" type="button">Заказать</button> | ||
</li> | ||
<li class="product__list-item"> | ||
<a class="product__image-link" href="#"> | ||
<img class="product__image" src="img/catalog/cat-energy-pro-fish-1000.png" | ||
width="84" height="100" alt="Cat Energy PRO Рыба 1000 г"> | ||
</a> | ||
<div class="product__card"> | ||
<a href="#"> | ||
<h2 class="product__card-title">Cat Energy PRO 1000 г</h2> | ||
</a> | ||
<dl class="product__card-list"> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Масса</dt> | ||
<dd class="product__card-description">1000 г</dd> | ||
</div> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Вкус</dt> | ||
<dd class="product__card-description">Рыба</dd> | ||
</div> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Цена</dt> | ||
<dd class="product__card-description">1000 ₽</dd> | ||
</div> | ||
</dl> | ||
</div> | ||
<button class="product__button button" type="button">Заказать</button> | ||
</li> | ||
<li class="product__list-item"> | ||
<a class="product__image-link" href="#"> | ||
<img class="product__image" src="img/catalog/cat-energy-slim-buckwheat-500.png" | ||
width="68" height="78" alt="Cat Energy slim Гречка 500 г"> | ||
</a> | ||
<div class="product__card"> | ||
<a href="#"> | ||
<h2 class="product__card-title">Cat Energy slim 500 г</h2> | ||
</a> | ||
<dl class="product__card-list"> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Масса</dt> | ||
<dd class="product__card-description">500 г</dd> | ||
</div> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Вкус</dt> | ||
<dd class="product__card-description">Гречка</dd> | ||
</div> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Цена</dt> | ||
<dd class="product__card-description">400 ₽</dd> | ||
</div> | ||
</dl> | ||
</div> | ||
<button class="product__button button" type="button">Заказать</button> | ||
</li> | ||
<li class="product__list-item"> | ||
<a class="product__image-link" href="#"> | ||
<img class="product__image" src="img/catalog/cat-energy-slim-buckwheat-1000.png" | ||
width="84" height="100" alt="Cat Energy slim Гречка 1000 г"> | ||
</a> | ||
<div class="product__card"> | ||
<a href="#"> | ||
<h2 class="product__card-title">Cat Energy slim 1000 г</h2> | ||
</a> | ||
<dl class="product__card-list"> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Масса</dt> | ||
<dd class="product__card-description">1000 г</dd> | ||
</div> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Вкус</dt> | ||
<dd class="product__card-description">Гречка</dd> | ||
</div> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Цена</dt> | ||
<dd class="product__card-description">700 ₽</dd> | ||
</div> | ||
</dl> | ||
</div> | ||
<button class="product__button button" type="button">Заказать</button> | ||
</li> | ||
<li class="product__list-item"> | ||
<a class="product__image-link" href="#"> | ||
<img class="product__image" src="img/catalog/cat-energy-slim-rice-500.png" | ||
width="72" height="84" alt="Cat Energy slim Рис 500 г"> | ||
</a> | ||
<div class="product__card"> | ||
<a href="#"> | ||
<h2 class="product__card-title">Cat Energy slim 500 г</h2> | ||
</a> | ||
<dl class="product__card-list"> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Масса</dt> | ||
<dd class="product__card-description">500 г</dd> | ||
</div> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Вкус</dt> | ||
<dd class="product__card-description">Рис</dd> | ||
</div> | ||
<div class="product__card-item"> | ||
<dt class="product__card-value">Цена</dt> | ||
<dd class="product__card-description">500 ₽</dd> | ||
</div> | ||
</dl> | ||
</div> | ||
<button class="product__button button" type="button">Заказать</button> | ||
</li> | ||
<li class="product__list-item product__list-item--more"> | ||
<div class="product__card product__card--more"> | ||
<h2 class="product__card-title product__card-title--more">Показать еще 100500 товаров</h2> | ||
<p class="product__card-text">На самом деле вкусов гораздо больше!</p> | ||
</div> | ||
<button class="product__button product__button--more button" type="button">Показать все</button> | ||
</li> | ||
</ul> | ||
</div> | ||
</section> | ||
<section class="additional"> | ||
<div class="additional__wrapper"> | ||
<h2 class="additional__title additional__title--decor">Дополнительные товары</h2> | ||
<dl class="additional__list"> | ||
<div class="additional__item"> | ||
<h3 class="additional__item-title">Сахарозаменитель</h3> | ||
<dt class="additional__item-value">1 упаковка (100 г)</dt> | ||
<dd class="additional__item-description">200 ₽</dd> | ||
<button class="additional__button button" type="button">Заказать</button> | ||
</div> | ||
<div class="additional__item"> | ||
<h3 class="additional__item-title">Питьевая вода</h3> | ||
<dt class="additional__item-value">5 литров</dt> | ||
<dd class="additional__item-description">50 ₽</dd> | ||
<button class="additional__button button" type="button">Заказать</button> | ||
</div> | ||
<div class="additional__item"> | ||
<h3 class="additional__item-title">Молоко</h3> | ||
<dt class="additional__item-value">1 литр</dt> | ||
<dd class="additional__item-description">100 ₽</dd> | ||
<button class="additional__button button" type="button">Заказать</button> | ||
</div> | ||
<div class="additional__item"> | ||
<h3 class="additional__item-title">Витамины</h3> | ||
<dt class="additional__item-value">1 упаковка (30 г)</dt> | ||
<dd class="additional__item-description">300 ₽</dd> | ||
<button class="additional__button button" type="button">Заказать</button> | ||
</div> | ||
</dl> | ||
<div class="additional__gift"> | ||
<h3 class="visually-hidden">Получить подарок</h3> | ||
<p class="additional__gift-text">Закажите все и получите чехол для кота в подарок!</p> | ||
</div> | ||
</div> | ||
</section> | ||
</main> | ||
<footer class="main-footer"> | ||
<div class="main-footer__wrapper"> | ||
<div class="main-footer__contacts contacts"> | ||
<b class="contacts__title">Приглашаем к сотрудничеству дилеров!</b> | ||
<p class="contacts__text">ул. Большая Конюшенная, д. 19/8 Санкт-Петербург</p> | ||
<div class="contacts__map"></div> | ||
</div> | ||
<a class="main-footer__logo logo" href="#"> | ||
<img src="img/logo-mobile.svg" width="33" height="38" | ||
alt="Функциональное питание для котов «Cat Energy»."> | ||
</a> | ||
<div class="main-footer__social social"> | ||
<ul class="social__list"> | ||
<li class="social__item"> | ||
<a class="social__link social__link--vkontakte" href="https://vk.com/htmlacademy">Мы в Вконтакте</a> | ||
</li> | ||
<li class="social__item"> | ||
<a class="social__link social__link--youtube" href="https://www.youtube.com/user/htmlacademyru">Мы в Ютубе</a> | ||
</li> | ||
<li class="social__item"> | ||
<a class="social__link social__link--telegram" href="https://t.me/htmlacademy">Мы в Телеграме</a> | ||
</li> | ||
</ul> | ||
</div> | ||
<div class="main-footer__copyright copyright"> | ||
<a class="copyright__link" href="https://htmlacademy.ru/intensive/adaptive">HTML Academy</a> | ||
</div> | ||
</div> | ||
</footer> | ||
</body> | ||
</html> |
Oops, something went wrong.