-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcatalog.html
1 lines (1 loc) · 14.5 KB
/
catalog.html
1
<!DOCTYPE html><html class="page" lang="ru"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>HTML Academy: Кэт энерджи</title><link href="css/style.min.css" rel="stylesheet"><link rel="icon" href="favicon/favicon-16x16.ico" sizes="16x16" type="image/vnd.microsoft.icon"><link rel="icon" href="favicon/favicon-32x32.ico" sizes="32x32" type="image/vnd.microsoft.icon"><link rel="icon" href="favicon/favicon.svg" sizes="any" type="image/svg+xml"><link rel="preload" href="/fonts/oswaldregular.woff2" as="font" type="font/woff2" crossorigin="anonymous"><link rel="preload" href="/fonts/oswaldmedium.woff2" as="font" type="font/woff2" crossorigin="anonymous"></head><body class="page-body"><header class="page-header container"><a class="page-header__logo" href="index.html"><picture><source media="(min-width: 1440px)" srcset="img/logo-desktop.svg"><source media="(min-width: 768px)" srcset="img/logo-tablet.svg"><img class="page-header__logo-image" src="img/logo-mobile.svg" width="34" height="38" alt="Функциональное питание для котов"></picture><img class="page-header__logo-brand" src="img/logo-brandname.svg" width="101" height="18" alt="Cat Energy"></a><nav class="main-nav main-nav--closed main-nav--no-js"><button type="button" class="main-nav__toggle main-nav__toggle--no-js" aria-label="Показать/скрыть меню"></button><div class="main-nav__wrapper"><ul class="main-nav__list"><li class="main-nav__item"><a class="main-nav__link" href="index.html">Главная</a></li><li class="main-nav__item"><a class="main-nav__link main-nav__link--green main-nav__link--active">Каталог продукции</a></li><li class="main-nav__item"><a class="main-nav__link" href="programs.html">Подбор программы</a></li></ul></div></nav></header><main class="page-catalog"><section class="catalog container"><h1 class="page-catalog__title">Каталог продукции</h1><h2 class="visually-hidden">Список продуктов</h2><div class="catalog__list"><div class="catalog__item"><a class="catalog__image-container" href="#"><picture><source type="image/webp" media="(min-width: 768px)" srcset="img/catalog/tablet/chicken-500-tablet.webp, img/catalog/tablet/[email protected] 2x"><source media="(min-width: 768px)" srcset="img/catalog/tablet/chicken-500-tablet.png, img/catalog/tablet/[email protected] 2x"><img class="catalog__image" src="img/catalog/mobile/chicken-500-mobile.png" srcset="img/catalog/mobile/[email protected] 2x" width="68" height="86" alt="Корм Cat Energy Pro 500 г"></picture></a><a class="catalog__header" href="#"><h3 class="catalog__title">Cat Energy Pro 500 г</h3></a><div class="details"><dl class="details__list"><div class="details__item"><dt class="details__term">500 г</dt><dd class="details__description">Масса</dd></div><div class="details__item"><dt class="details__term">Курица</dt><dd class="details__description">Вкус</dd></div><div class="details__item"><dt class="details__term">700 Р.</dt><dd class="details__description">Цена</dd></div></dl></div><a class="catalog__button button" href="#">Заказать</a></div><div class="catalog__item"><a class="catalog__image-container catalog__image-container--big" href="#"><picture><source type="image/webp" media="(min-width: 768px)" srcset="img/catalog/tablet/chicken-1000-tablet.webp, img/catalog/tablet/[email protected] 2x"><source media="(min-width: 768px)" srcset="img/catalog/tablet/chicken-1000-tablet.png, img/catalog/tablet/[email protected] 2x"><img class="catalog__image catalog__image--big" src="img/catalog/mobile/chicken-1000-mobile.png" srcset="img/catalog/mobile/[email protected] 2x" width="84" height="100" alt="Cat Energy Pro 1000 г"></picture></a><a class="catalog__header" href="#"><h3 class="catalog__title">Cat Energy Pro 1000 г</h3></a><div class="details"><dl class="details__list"><div class="details__item"><dt class="details__term">1000 г</dt><dd class="details__description">Масса</dd></div><div class="details__item"><dt class="details__term">Курица</dt><dd class="details__description">Вкус</dd></div><div class="details__item"><dt class="details__term">1000 Р.</dt><dd class="details__description">Цена</dd></div></dl></div><a class="catalog__button button" href="#">Заказать</a></div><div class="catalog__item"><a class="catalog__image-container" href="#"><picture><source type="image/webp" media="(min-width: 768px)" srcset="img/catalog/tablet/fish-500-tablet.webp, img/catalog/tablet/fish-500-tablet.webp 2x"><source media="(min-width: 768px)" srcset="img/catalog/tablet/fish-500-tablet.png, img/catalog/tablet/fish-500-tablet.png 2x"><img class="catalog__image catalog__image--small" src="img/catalog/mobile/fish-500-mobile.png" srcset="img/catalog/mobile/[email protected] 2x" width="68" height="86" alt="Cat Energy Pro 500 г"></picture></a><a class="catalog__header" href="#"><h3 class="catalog__title">Cat Energy Pro 500 г</h3></a><div class="details"><dl class="details__list"><div class="details__item"><dt class="details__term">500 г</dt><dd class="details__description">Масса</dd></div><div class="details__item"><dt class="details__term">Рыба</dt><dd class="details__description">Вкус</dd></div><div class="details__item"><dt class="details__term">700 Р.</dt><dd class="details__description">Цена</dd></div></dl></div><a class="catalog__button button" href="#">Заказать</a></div><div class="catalog__item"><a class="catalog__image-container catalog__image-container--big" href="#"><picture><source type="image/webp" media="(min-width: 768px)" srcset="img/catalog/tablet/fish-1000-tablet.webp, img/catalog/tablet/[email protected] 2x"><source media="(min-width: 768px)" srcset="img/catalog/tablet/fish-1000-tablet.png, img/catalog/tablet/[email protected] 2x"><img class="catalog__image catalog__image--big" src="img/catalog/mobile/fish-1000-mobile.png" srcset="img/catalog/mobile/[email protected] 2x" width="84" height="100" alt="Cat Energy Pro 1000 г"></picture></a><a class="catalog__header" href="#"><h3 class="catalog__title">Cat Energy Pro 1000 г</h3></a><div class="details"><dl class="details__list"><div class="details__item"><dt class="details__term">1000 г</dt><dd class="details__description">Масса</dd></div><div class="details__item"><dt class="details__term">Рыба</dt><dd class="details__description">Вкус</dd></div><div class="details__item"><dt class="details__term">1000 Р.</dt><dd class="details__description">Цена</dd></div></dl></div><a class="catalog__button button" href="#">Заказать</a></div><div class="catalog__item"><a class="catalog__image-container" href="#"><picture><source type="image/webp" media="(min-width: 768px)" srcset="img/catalog/tablet/buckwheat-500-tablet.webp, img/catalog/tablet/[email protected] 2x"><source media="(min-width: 768px)" srcset="img/catalog/tablet/buckwheat-500-tablet.png, img/catalog/tablet/[email protected] 2x"><img class="catalog__image catalog__image--small" src="img/catalog/mobile/buckwheat-500-mobile.png" srcset="img/catalog/mobile/[email protected] 2x" width="68" height="86" alt="Cat Energy Slim 500 г"></picture></a><a class="catalog__header" href="#"><h3 class="catalog__title">Cat Energy Slim 500 г</h3></a><div class="details"><dl class="details__list"><div class="details__item"><dt class="details__term">500 г</dt><dd class="details__description">Масса</dd></div><div class="details__item"><dt class="details__term">Гречка</dt><dd class="details__description">Вкус</dd></div><div class="details__item"><dt class="details__term">400 Р.</dt><dd class="details__description">Цена</dd></div></dl></div><a class="catalog__button button" href="#">Заказать</a></div><div class="catalog__item"><a class="catalog__image-container catalog__image-container--big" href="#"><picture><source type="image/webp" media="(min-width: 768px)" srcset="img/catalog/tablet/buckwheat-1000-tablet.webp, img/catalog/tablet/[email protected] 2x"><source media="(min-width: 768px)" srcset="img/catalog/tablet/buckwheat-1000-tablet.png, img/catalog/tablet/[email protected] 2x"><img class="catalog__image catalog__image--big" src="img/catalog/mobile/buckwheat-1000-mobile.png" srcset="img/catalog/mobile/[email protected] 2x" width="84" height="100" alt="Cat Energy Slim 1000 г"></picture></a><a class="catalog__header" href="#"><h3 class="catalog__title">Cat Energy Slim 1000 г</h3></a><div class="details"><dl class="details__list"><div class="details__item"><dt class="details__term">1000 г</dt><dd class="details__description">Масса</dd></div><div class="details__item"><dt class="details__term">Гречка</dt><dd class="details__description">Вкус</dd></div><div class="details__item"><dt class="details__term">700 Р.</dt><dd class="details__description">Цена</dd></div></dl></div><a class="catalog__button button" href="#">Заказать</a></div><div class="catalog__item"><a class="catalog__image-container" href="#"><picture><source type="image/webp" media="(min-width: 768px)" srcset="img/catalog/tablet/rice-500-tablet.webp, img/catalog/tablet/[email protected] 2x"><source media="(min-width: 768px)" srcset="img/catalog/tablet/rice-500-tablet.png, img/catalog/tablet/[email protected] 2x"><img class="catalog__image catalog__image--small" src="img/catalog/mobile/rice-500-mobile.png" srcset="img/catalog/mobile/[email protected]" width="68" height="86" alt="Cat Energy Slim 500 г"></picture></a><a class="catalog__header" href="#"><h3 class="catalog__title">Cat Energy Slim 500 г</h3></a><div class="details"><dl class="details__list"><div class="details__item"><dt class="details__term">500 г</dt><dd class="details__description">Масса</dd></div><div class="details__item"><dt class="details__term">Рис</dt><dd class="details__description">Вкус</dd></div><div class="details__item"><dt class="details__term">500 Р.</dt><dd class="details__description">Цена</dd></div></dl></div><a class="catalog__button button" href="#">Заказать</a></div><div class="catalog__item more"><h3 class="visually-hidden">Все товары</h3><p class="more__title">Показать еще 100500 товаров</p><p class="more__subtitle">На самом деле вкусов гораздо больше!</p><a class="more__button button button--wide button--grey" href="#">Показать все</a></div></div></section><section class="goods container"><div class="goods__header"><h2 class="goods__heading decoration-heading">Дополнительные товары</h2></div><div class="goods__wrapper"><ul class="goods__list"><li class="goods__item"><h3 class="goods__title">Сахарозаменитель</h3><dl class="goods__price price"><dt class="price__units">1 упаковка (100г)</dt><dd class="price__amount">200 Р.</dd></dl><a class="goods__button button" href="#">Заказать</a></li><li class="goods__item"><h3 class="goods__title">Питьевая вода</h3><dl class="goods__price price"><dt class="price__units">5 литров</dt><dd class="price__amount">50 Р.</dd></dl><a class="goods__button button" href="#">Заказать</a></li><li class="goods__item"><h3 class="goods__title">Молоко</h3><dl class="goods__price price"><dt class="price__units">1 литр</dt><dd class="price__amount">100 Р.</dd></dl><a class="goods__button button" href="#">Заказать</a></li><li class="goods__item"><h3 class="goods__title">Витамины</h3><dl class="goods__price price"><dt class="price__units">1 упаковка (30г)</dt><dd class="price__amount">300 Р.</dd></dl><a class="goods__button button" href="#">Заказать</a></li></ul><div class="goods__promo promo"><p class="promo__slogan">Закажите все и получите чехол для кота в подарок!</p></div></div></section><section class="contact"><div class="contact__container contact__container--grey"><div class="contact__block"><h2 class="visually-hidden">Наши контакты</h2><p class="contact__slogan">Приглашаем<br>к сотрудничеству дилеров</p><address class="contact__address"><span>ул. Большая Конюшенная, д. 19/8</span><span>Санкт-Петербург</span></address></div></div><div class="contact__map contact__map--no-js"></div><picture><source type="image/webp" media="(min-width: 1440px)" srcset="img/map/location-desktop.webp, img/map/[email protected] 2x"><source media="(min-width: 1440px)" srcset="img/map/location-desktop.jpg, img/map/[email protected] 2x"><source type="image/webp" media="(min-width: 768px)" srcset="img/map/location-tablet.webp, img/map/[email protected] 2x"><source media="(min-width: 768px)" srcset="img/map/location-desktop.jpg, img/map/[email protected] 2x"><source type="image/webp" srcset="./img/map/location-mobile.webp, img/map/location-mobile.webp 2x"><img class="contact__map-image" src="./img/map/location-mobile.jpg" srcset="img/map/[email protected] 2x" width="320" height="362" alt="Карта"></picture></section></main><footer class="page-footer"><div class="container page-footer__container"><a class="page-footer__logo" href="./index.html"><img src="img/logo-brandname.svg" width="128" height="24" alt="Cat Energy"></a><ul class="page-footer__social social-list"><li class="social-list__item"><a class="social-list__link" href="https://vk.com/htmlacademy" aria-label="Facebook"><svg class="social-list__image" width="29" height="18"><use xlink:href="img/sprite.svg#icon-vk"/></svg></a></li><li class="social-list__item"><a class="social-list__link" href="https://instagram.com/htmlacademy" aria-label="Instagram"><svg class="social-list__image" width="23" height="23"><use xlink:href="img/sprite.svg#icon-instagram"/></svg></a></li><li class="social-list__item"><a class="social-list__link" href="https://facebook.com/htmlacademy" aria-label="Вконтакте"><svg class="social-list__image" width="23" height="29"><use xlink:href="img/sprite.svg#icon-facebook"/></svg></a></li></ul><a class="page-footer__copyright" href="https://htmlacademy.ru/intensive/adaptive" aria-label="Сайт HTML Academy"><span class="page-footer__copyright-text">HTML Academy</span> <svg width="27" height="34"><use xlink:href="img/sprite.svg#icon-html-academy"/></svg></a></div></footer><script src="./js/app.min.js"></script><script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBEjUDmUCfkNuhtJShA6MPyVSkjtKCx6cs&callback=initMap" async defer="defer"></script></body></html>