Skip to content

Commit

Permalink
Merge pull request #4 from posplawone/module4-task1
Browse files Browse the repository at this point in the history
keksobot authored Apr 17, 2024
2 parents 908c560 + 745ccfe commit 8900301
Showing 21 changed files with 2,699 additions and 758 deletions.
631 changes: 341 additions & 290 deletions source/catalog.html

Large diffs are not rendered by default.

63 changes: 35 additions & 28 deletions source/form.html
Original file line number Diff line number Diff line change
@@ -4,33 +4,36 @@
<meta charset="UTF-8">
<title>Cat Energy</title>
<link rel="stylesheet" href="css/style.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body class="page__body">
<header class="site-header">
<a class="site-header__link" href="index.html">
<img class="site-header__link--logo" src="img/logo.svg" width="202" height="59"
<img class="site-header__image" src="img/logo.svg" width="202" height="59"
alt="Логотип «Кэт Энерджи»">
</a>
<nav class="site-header__navigation">
<button class="site-header__toggle visually-hidden" type="button"><span>Открыть меню</span></button>
<div class="site-header__wrapper">
<ul class="site-header__list">
<li class="site-header__item">
<a class="site-header__link" href="index.html">
Главная
</a>
</li>
<li class="site-header__item">
<a class="site-header__link" href="catalog.html">
Каталог продукции
</a>
</li>
<li class="site-header__item site-header__item--current">
<a class="site-header__link" href="#">
Подбор программы
</a>
</li>
</ul>
<button class="main-header__toggle" type="button">
<span class="visually-hidden">Открыть меню</span>
<img class="site-header__image" src="img/header-toogle.svg" width="24" height="24">
</button>
<ul class="site-header__list">
<li class="site-header__item">
<a class="site-header__link" href="index.html">
Главная
</a>
</li>
<li class="site-header__item">
<a class="site-header__link" href="catalog.html">
Каталог продукции
</a>
</li>
<li class="site-header__item site-header__item--current">
<a class="site-header__link" href="#">
Подбор программы
</a>
</li>
</ul>
</nav>
</header>

@@ -48,11 +51,11 @@ <h1 class="form__title">Подбор программы</h1>
<input class="input-block__field" id="form__phone" name="form__phone" placeholder="Барсик">
</li>
<li class="form__item input-block">
<label class="input-block__label" for="form__weight">Вес (кг):*</label>
<label class="input-block__label" for="form__weight">Вес&nbsp;(кг):*</label>
<input class="input-block__field" id="form__weight" name="form__weight" placeholder="7">
</li>
<li class="form__item input-block">
<label class="input-block__label" for="form__age">Возраст (лет):*</label>
<label class="input-block__label" for="form__age">Возраст&nbsp;(лет):*</label>
<input class="input-block__field" id="form__age" name="form__age" placeholder="7">
</li>
</ul>
@@ -61,7 +64,7 @@ <h1 class="form__title">Подбор программы</h1>
<ul class="form__list">
<li class="form__item radio-block">
<label class="radio-block__control">
<input class="radio-block__input" type="radio" name="food__program" value="slimming">
<input class="radio-block__input" type="radio" name="food__program" value="slimming" checked>
<span class="radio-block__label">Похудение</span>
</label>
</li>
@@ -104,7 +107,7 @@ <h2 class="contacts__title">Контактные данные (владельц
<div class="comment__wrapper">
<h2 class="comment__title">Комментарий</h2>
<label class="visually-hidden" for="comment__message"></label>
<textarea class="comment__message--field field" id="comment-message" name="commment-message" placeholder="Расскажите обо всех повадках кота" required></textarea>
<textarea class="comment__message" id="comment-message" name="commment-message" placeholder="Расскажите обо всех повадках кота" required></textarea>
</div>
</section>

@@ -151,14 +154,15 @@ <h2 class="additionally__title">Дополнительно</h2>
Приглашаем к&nbsp;сотрудничеству дилеров!
</p>
<div class="map__description">
<p class="map__description--address">
<p class="map__address">
ул. Большая Конюшенная,д.&nbsp;19/8
</p>
<span class="map__description--city">
<span class="map__city">
Санкт-Петербург
</span>
</div>
</address>
<img class="map__image" src="img/map-mobile.jpg" width="320" height="362" alt="">
</div>
</section>
</main>
@@ -191,10 +195,13 @@ <h2 class="additionally__title">Дополнительно</h2>
</div>
<div class="main-footer__copyright copyright">
<a class="copyright__link" href="https://htmlacademy.ru">
<img class="copyright__image" src="img/html-academy.svg" width="168" height="37">
HTML Academy
</a>
<a class="copyright__link-image" href="https://htmlacademy.ru">
<img class="copyright__image" src="img/copyright.svg" width="27" height="34">
</a>
</div>
</div>
</footer>
</body>
</html>
</html>
1 change: 1 addition & 0 deletions source/img/copyright.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions source/img/header-toogle.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added source/img/map-mobile.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
112 changes: 59 additions & 53 deletions source/index.html
Original file line number Diff line number Diff line change
@@ -4,54 +4,54 @@
<meta charset="UTF-8">
<title>Cat Energy</title>
<link rel="stylesheet" href="css/style.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body class="page__body">
<header class="main-header">
<a class="main-header__link" href="index.html">
<img class="main-header__link--logo" src="img/logo.svg" width="202" height="59"
<img class="main-header__logo" src="img/logo.svg" width="202" height="59"
alt="Логотип «Кэт Энерджи»">
</a>
<nav class="main-header__navigation">
<button class="main-header__toggle visually-hidden" type="button"><span>Открыть меню</span></button>
<div class="main-header__wrapper">
<ul class="main-header__list">
<li class="main-header__item main-header__item--current">
<a class="main-header__link" href="#">
Главная
</a>
</li>
<li class="main-header__item">
<a class="main-header__link" href="catalog.html">
Каталог продукции
</a>
</li>
<li class="main-header__item">
<a class="main-header__link" href="form.html">
Подбор программы
</a>
</li>
</ul>
<button class="main-header__toggle" type="button">
<span class="visually-hidden">Открыть меню</span>
<img class="main-header__image" src="img/header-toogle.svg" width="24" height="24">
</button>
<ul class="main-header__list">
<li class="main-header__item main-header__item--current">
<a class="main-header__link" href="#">
Главная
</a>
</li>
<li class="main-header__item">
<a class="main-header__link" href="catalog.html">
Каталог продукции
</a>
</li>
<li class="main-header__item">
<a class="main-header__link" href="form.html">
Подбор программы
</a>
</li>
</ul>
</nav>
</header>

<main class="main-container">

<h1 class="visually-hidden">Кэт Энерджи - функциональное питание для котов.</h1>

<section class="program">
<div class="program__wrapper">
<header class="program__header">
<h2 class="program__title">
<h1 class="program__title">
Функциональное питание&nbsp;для&nbsp;котов
</h2>
</h1>
<p class="program__slogan">
Занялся собой? Займись котом!
</p>
<a class="program__toggle" href="#">
Подобрать программу
</a>
</header>
<img class="program__image" src="img/program-image.png" width="552" height="499" alt="Упаковка корма cо вкусом курицы">
<img class="program__image" src="img/program-image.png" width="280" height="270" alt="Упаковка корма cо вкусом курицы">
<a class="program__toggle" href="#">
Подобрать программу
</a>
</div>
</section>

@@ -61,9 +61,9 @@ <h2 class="visually-hidden">
Программы питания, которые подойдут Вашему питомцу.
</h2>
<ul class="food__list">
<li class="food__item food__item--slimming">
<li class="food__item">
<h3 class="food__title">
<img class="food__image" src="img/food-slimming.svg" width="100" height="106" alt="Иконка стройной кошки">
<img class="food__image-slimming" src="img/food-slimming.svg" width="100" height="106" alt="Иконка стройной кошки">
Похудение
</h3>
<p class="food__description">
@@ -74,9 +74,9 @@ <h3 class="food__title">
<img class="food__link" src="img/food-black-arrow.svg" width="24" height="12">
</a>
</li>
<li class="food__item food__item--weight">
<li class="food__item">
<h3 class="food__title">
<img class="food__image" src="img/food-weight.svg" width="134" height="100" alt="Иконка мускулистой кошки">
<img class="food__image-weight" src="img/food-weight.svg" width="134" height="100" alt="Иконка мускулистой кошки">
Набор массы
</h3>
<p class="food__description">
@@ -137,26 +137,28 @@ <h2 class="example__title">
<p class="example__description">
Борис сбросил 5 кг за 2 месяца, просто заменив свой обычный корм на Cat Energy Slim. Отличный результат без изнуряющих тренировок! При этом он не менял своих привычек и по-прежнему спит по 16 часов в день.
</p>
<div class="example__tables">
<div class="example__result">
<p class="example__result--title">5 кг</p>
<span class="example__result--description">снижение веса</span>
<div class="example__total">
<div class="example__tables">
<div class="example__result">
<p class="example__value">5 кг</p>
<span class="example__expenses">снижение веса</span>
</div>
<div class="example__result">
<p class="example__value">60 дней</p>
<span class="example__expenses">затрачено времени</span>
</div>
</div>
<div class="example__result">
<p class="example__result--title">60 дней</p>
<span class="example__result--description">затрачено времени</span>
<div class="example__costs">
<p class="example__food">
Затраты на питание:
</p>
<p class="example__price">
15 000 руб.
</p>
</div>
</div>
<div class="example__costs">
<p class="example__costs--food">
Затраты на питание:
</p>
<p class="example__costs--price">
15 000 руб.
</p>
</div>
</div>
<img class="example__image" src="img/example-cat.png" width="560" height="512" alt="">
<img class="example__image" src="img/example-cat.png" width="280" height="256" alt="">
</div>
</section>

@@ -167,14 +169,15 @@ <h2 class="example__title">
Приглашаем к&nbsp;сотрудничеству дилеров!
</p>
<div class="map__description">
<p class="map__description--address">
<p class="map__address">
ул. Большая Конюшенная,д.&nbsp;19/8
</p>
<span class="map__description--city">
<span class="map__city">
Санкт-Петербург
</span>
</div>
</address>
<img class="map__image" src="img/map-mobile.jpg" width="320" height="362" alt="">
</div>
</section>
</main>
@@ -207,10 +210,13 @@ <h2 class="example__title">
</div>
<div class="main-footer__copyright copyright">
<a class="copyright__link" href="https://htmlacademy.ru">
<img class="copyright__image" src="img/html-academy.svg" width="168" height="37">
HTML Academy
</a>
<a class="copyright__link-image" href="https://htmlacademy.ru">
<img class="copyright__image" src="img/copyright.svg" width="27" height="34">
</a>
</div>
</div>
</footer>
</body>
</html>
</html>
Loading

0 comments on commit 8900301

Please sign in to comment.