-
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.
Merge pull request #3 from LailaAlba/module2-task1
Module2 task1
- Loading branch information
Showing
39 changed files
with
1,121 additions
and
39 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
This file was deleted.
Oops, something went wrong.
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,201 @@ | ||
<!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="main-header"> | ||
<a class="main-header__logo" href="index.html"> | ||
<picture> | ||
<source media="(min-width: 768px)" type="source" srcset="./images/logo-tablet.svg"> | ||
<img src="./images/logo-mobile.svg" alt="Логотип кокой"> | ||
</picture> | ||
</a> | ||
<nav class="main-nav"> | ||
<button class="main-nav__toggle" type="button"> | ||
<span class="visually-hidden">Открыть меню</span> | ||
</button> | ||
<ul class="main-nav__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="main-catalog"> | ||
<section class="product"> | ||
<h1 class="product__title">Каталог продукции</h1> | ||
<ul class="product-card"> | ||
|
||
<li class="product-card catalog__card"> | ||
<div class="product-card content__card"> | ||
<img class="prodact-image" alt="Корм с курой" src="#"> | ||
<h2 class="product-card__title">Cat Energy PRO 500 г</h2> | ||
<p class="product-card__text">Масса 500 г</p> | ||
<p class="product-card__text">Вкус Курица</p> | ||
<p class="product-card__text">Цена 700₽</p> | ||
<a class="link link--product" href="#">Заказать</a> | ||
</div> | ||
</li> | ||
|
||
<li class="product-card catalog__card"> | ||
<div class="product-card content__card"> | ||
<img class="prodact-image" alt="Корм с курой" src="#"> | ||
<h2 class="product-card__title">Cat Energy PRO 1000 г</h2> | ||
<p class="product-card__text">Масса 1000 г</p> | ||
<p class="product-card__text">Вкус Курица</p> | ||
<p class="product-card__text">Цена 1000₽</p> | ||
<a class="link link--product" href="#">Заказать</a> | ||
</div> | ||
</li> | ||
|
||
<li class="product-card catalog__card"> | ||
<div class="product-card content__card"> | ||
<img class="prodact-image" alt="Корм с рыбой" src="#"> | ||
<h2 class="product-card__title">Cat Energy PRO 500 г</h2> | ||
<p class="product-card__text">Масса 500 г</p> | ||
<p class="product-card__text">Вкус Рыба</p> | ||
<p class="product-card__text">Цена 700₽</p> | ||
<a class="link link--product" href="#">Заказать</a> | ||
</div> | ||
</li> | ||
|
||
<li class="product-card catalog__card"> | ||
<div class="product-card content__card"> | ||
<img class="prodact-image" alt="Корм с рыбой" src="#"> | ||
<h2 class="product-card__title">Cat Energy PRO 1000 г</h2> | ||
<p class="product-card__text">Масса 1000 г</p> | ||
<p class="product-card__text">Вкус Рыба</p> | ||
<p class="product-card__text">Цена 1000₽</p> | ||
<a class="link link--product" href="#">Заказать</a> | ||
</div> | ||
</li> | ||
|
||
<li class="product-card catalog__card"> | ||
<div class="product-card content__card"> | ||
<img class="prodact-image" alt="Корм с гречей" src="#"> | ||
<h2 class="product-card__title">Cat Energy SLIM 500 г</h2> | ||
<p class="product-card__text">Масса 500 г</p> | ||
<p class="product-card__text">Вкус Гречка</p> | ||
<p class="product-card__text">Цена 700₽</p> | ||
<a class="link link--product" href="#">Заказать</a> | ||
</div> | ||
</li> | ||
|
||
<li class="product-card catalog__card"> | ||
<div class="product-card content__card"> | ||
<img class="prodact-image" alt="Корм с гречей" src="#"> | ||
<h2 class="product-card__title">Cat Energy SLIM 1000 г</h2> | ||
<p class="product-card__text">Масса 1000 г</p> | ||
<p class="product-card__text">Вкус Гречка</p> | ||
<p class="product-card__text">Цена 1000₽</p> | ||
<a class="link link--product" href="#">Заказать</a> | ||
</div> | ||
</li> | ||
|
||
<li class="product-card catalog__card"> | ||
<div class="product-card content__card"> | ||
<img class="prodact-image" alt="Корм с рисом" src="#"> | ||
<h2 class="product-card__title">Cat Energy SLIM 500 г</h2> | ||
<p class="product-card__text">Масса 500 г</p> | ||
<p class="product-card__text">Вкус Рис</p> | ||
<p class="product-card__text">Цена 700₽</p> | ||
<a class="link link--product" href="#">Заказать</a> | ||
</div> | ||
</li> | ||
|
||
<li class="product-card catalog__card"> | ||
<div class="product-card content__card"> | ||
|
||
<h2 class="product-card__title">Показать еще 100500 товаров</h2> | ||
<p class="product-card__text">На самом деле вкусов гораздо больше!</p> | ||
<a class="link link--product-all" href="#">Показать все</a> | ||
</div> | ||
</li> | ||
|
||
</ul> | ||
</section> | ||
|
||
<section class="add-product"> | ||
<h2 class="add-product__header">Дополнительные товары</h2> | ||
<ul class="add-product__list"> | ||
<li class="add-product__item"> | ||
<h3 class="add-product__tittle">Сахарозаменитель</h3> | ||
<p class="add-product__text">1 упаковка (100г) 200₽</p> | ||
<a class="link link--product" href="#">Заказать</a> | ||
</li> | ||
<li class="add-product__item"> | ||
<h3 class="add-product__tittle">Питьевая вода</h3> | ||
<p class="add-product__text">5 литров 50₽</p> | ||
<a class="link link--product" href="#">Заказать</a> | ||
</li> | ||
<li class="add-product__item"> | ||
<h3 class="add-product__tittle">Молоко</h3> | ||
<p class="add-product__text">1 литр 100₽</p> | ||
<a class="link link--product" href="#">Заказать</a> | ||
</li> | ||
<li class="add-product__item"> | ||
<h3 class="add-product__tittle">Витамины</h3> | ||
<p class="add-product__text">1 упаковка 300₽</p> | ||
<a class="link link--product" href="#">Заказать</a> | ||
</li> | ||
</ul> | ||
<div class="add-product present-card"> | ||
<p>Закажите все и получите чехол для кота в подарок!</p> | ||
</div> | ||
</section> | ||
<section class="subscribe"> | ||
<h1 class="subscribe__title">Акции и новинки</h1> | ||
<p class="subscribe__text">Подпишитесь на наши новости и не пропустите ни одного предложения!</p> | ||
<form class="subscribe__form" action="https://echo.htmlacademy.ru" method="post"> | ||
<label> | ||
<input type="email" name="email" value="[email protected]" placeholder="enter your e-mail" required=""> | ||
</label> | ||
<button class="button subscribe__button" type="submit">Подписаться</button> | ||
</form> | ||
</section> | ||
</main> | ||
|
||
<footer class="footer"> | ||
<div class="footer__wrapper"> | ||
<h2 class="footer__title">Приглашаем к сотрудничеству дилеров!</h2> | ||
<p class="footer__text">ул. Большая Конюшенная, д. 19/8 Санкт-Петербург</p> | ||
<div class="footer__map"><a class="map__spb" href="#" aria-label="Карта СПб"></a> | ||
</div> | ||
<div class="footer__elements"><a class="footer-logo" href="#" aria-label="Логотип Cat Energy"> | ||
</a> | ||
<ul class="social-links"> | ||
<li class="social-links__item"> | ||
<a class="social-link social-link--vk" href="#" aria-label="Переход во вконтакте"> | ||
</a> | ||
</li> | ||
<li class="social-links__item"> | ||
<a class="social-link social-link-youtube" href="#" aria-label="Переход в youtube"> | ||
</a> | ||
</li> | ||
<li class="social-links__item"> | ||
<a class="social-link social-link-telegram" href="#" aria-label="Переход в телеграм"> | ||
</a> | ||
</li> | ||
</ul><a class="footer-link" href="#"> | ||
<span>HTML Academy</span> | ||
</a> | ||
</div> | ||
</div> | ||
</footer> | ||
</body> | ||
|
||
</html> |
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,95 @@ | ||
<!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="main-header"> | ||
<a class="main-header__logo" href="index.html"> | ||
<picture> | ||
<source media="(min-width: 768px)" type="source" srcset="./images/logo-tablet.svg"> | ||
<img src="./images/logo-mobile.svg" alt="Логотип кокой"> | ||
</picture> | ||
</a> | ||
<nav class="main-nav"> | ||
<button class="main-nav__toggle" type="button"> | ||
<span class="visually-hidden">Открыть меню</span> | ||
</button> | ||
<ul class="main-nav__list site-list"> | ||
<li class="site-list__item"> | ||
<a class="site-list__link" href="#">Главная</a> | ||
</li> | ||
<li class="site-list__item"> | ||
<a class="site-list__link" href="./catalog.html">Каталог продукции</a> | ||
</li> | ||
<li class="site-list__item"> | ||
<a class="site-list__link" href="#">Подбор программы</a> | ||
</li> | ||
</ul> | ||
</nav> | ||
</header> | ||
|
||
<main class="main-form"> | ||
<section class="questionnaire"> | ||
<h1 class="questionnaire__title">Подбор программы</h1> | ||
<p class="questionnaire__text">Заполните анкету и мы подберем программу питания для вашего кота</p> | ||
<form class="questionnaire__form" action="https://echo.htmlacademy.ru" method="post"> | ||
<fieldset class="questionnaire__fieldset questionnaire__fieldset--info"> | ||
<legend class="visually-hidden">Сбор информации о котике</legend> | ||
<div class="questionnaire__wrapper"> | ||
<ul class="questionnaire__fieldset-list"> | ||
<li class="questionnaire__field field-text field-text--name"> | ||
<label class="field-text__label" for="name">Имя:*</label> | ||
<input class="field-text__input" type="text" name="name" id="name" placeholder="Барсик" required> | ||
</li> | ||
<li class="questionnaire__field field-text field-text--weight"> | ||
<label class="field-text__label" for="weight">Вес (кг):*</label> | ||
<input class="field-text__input" type="text" name="weight" id="weight" placeholder="7" required> | ||
</li> | ||
<li class="questionnaire__field field-text field-text--age"> | ||
<label class="field-text__label" for="age">Возраст (лет):</label> | ||
<input class="field-text__input" type="text" name="age" id="age" placeholder="7"> | ||
</li> | ||
</ul> | ||
</div> | ||
</fieldset> | ||
</form> | ||
</section> | ||
</main> | ||
|
||
<footer class="footer"> | ||
<div class="footer__wrapper"> | ||
<h2 class="footer__title">Приглашаем к сотрудничеству дилеров!</h2> | ||
<p class="footer__text">ул. Большая Конюшенная, д. 19/8 Санкт-Петербург</p> | ||
<div class="footer__map"><a class="map__spb" href="#" aria-label="Карта СПб"></a> | ||
</div> | ||
<div class="footer__elements"><a class="footer-logo" href="#" aria-label="Логотип Cat Energy"> | ||
</a> | ||
<ul class="social-links"> | ||
<li class="social-links__item"> | ||
<a class="social-link social-link--vk" href="#" aria-label="Переход во вконтакте"> | ||
</a> | ||
</li> | ||
<li class="social-links__item"> | ||
<a class="social-link social-link-youtube" href="#" aria-label="Переход в youtube"> | ||
</a> | ||
</li> | ||
<li class="social-links__item"> | ||
<a class="social-link social-link-telegram" href="#" aria-label="Переход в телеграм"> | ||
</a> | ||
</li> | ||
</ul><a class="footer-link" href="#"> | ||
<span>HTML Academy</span> | ||
</a> | ||
</div> | ||
</div> | ||
</footer> | ||
</body> | ||
|
||
</html> |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Oops, something went wrong.