Исправление ошибок в БЭМ #2
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 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 |
|---|---|---|
| @@ -1,13 +1,113 @@ | ||
| <!DOCTYPE html> | ||
| <html class="page" lang="ru"> | ||
|
|
||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <title>Название проекта</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="#"> | ||
| <img class="main-header__logo-image" src="#" width="33" height="38" alt="Логотип Cat energy"> | ||
| </a> | ||
| <div class="main-header__text-logo"> | ||
| <h1 class="visually-hidden">Магазин Cat Energy</h1> | ||
| </div> | ||
| <nav class="main-navigation"> | ||
| <button class="main-navigation__toggle" type="button"> | ||
| <span class="visually-hidden">Открыть меню</span> | ||
| </button> | ||
| <ul class="main-navigation__list"> | ||
| <li class="main-navigation__list list-item"> | ||
|
There was a problem hiding this comment. бэм блок list-item выглядит лишним list-item__link -> main-navigation__link будет достаточно |
||
| <a class="list-item__link" href="#">Главная</a> | ||
| </li> | ||
| <li class="main-navigation__list list-item"> | ||
| <a class="list-item__link" href="#">Каталог продукции</a> | ||
| </li> | ||
| <li class="main-navigation__list list-item"> | ||
| <a class="list-item__link" href="#">Подбор программы</a> | ||
| </li> | ||
| </ul> | ||
| </nav> | ||
| </header> | ||
| <main class="main-container"> | ||
| <section class="hero"> | ||
| <h2 class="hero__title">Функциональное питание для котов</h2> | ||
| <p class="hero__advertisement">Занялся собой? Займись котом!</p> | ||
| <img class="hero__product-image" src="#" width="280" height="270" alt="Продукт Cat energy"> | ||
|
There was a problem hiding this comment. контентные изображения - помещай в обертку(див) для стилизации пикч |
||
| <a class="hero__link" href="#">Подобрать программу</a> | ||
| </section> | ||
| <div class="block"> | ||
|
There was a problem hiding this comment. из названия класса не понятно что оно означает There was a problem hiding this comment. также в этой секции 2 элемента, у тебя они разделены буд-то они разные по смыслу |
||
| <h3 class="block__title">похудение</h3> | ||
| <p class="block__description">Ваш кот весит больше собаки и почти утратил способность лазить по деревьям? Пора на диету! Cat Energy Slim поможет вашему питомцу сбросить лишний вес.</p> | ||
| <a class="block__link" href="#">Каталог slim</a> | ||
| </div> | ||
| <div class="block"> | ||
| <h3 class="block__title">Набор массы</h3> | ||
| <p class="block__description">Заработать авторитет среди дворовых котов и даже собак? Серия Cat Energy Pro поможет вашему коту нарастить необходимые мышцы!</p> | ||
| <a class="block__link" href="#">Каталог pro</a> | ||
| </div> | ||
| <section class="advantages"> | ||
| <h2 class="advantages__title">Как это работает</h2> | ||
| <ul class="advantages__list"> | ||
| <li class="advantages__list list-item"> | ||
|
There was a problem hiding this comment. тоже блок list-item ? точно ли будут стили одинаковые или для чего блок? выглядит также лишним |
||
| <p class="list-item__content">Функциональное питание содержит только полезные питательные вещества.</p> | ||
| </li> | ||
| <li class="advantages__list list-item"> | ||
| <p class="list-item__content">Выпускается в виде порошка, который нужно лишь залить кипятком и готово.</p> | ||
| </li> | ||
| <li class="advantages__list list-item"> | ||
| <p class="list-item__content">Замените один-два приема обычной еды на наше функциональное питание.</p> | ||
| </li> | ||
| <li class="advantages__list list-item"> | ||
| <p class="list-item__content">Уже через месяц наслаждайтесь изменениями к лучшему вашего питомца!</p> | ||
| </li> | ||
| </ul> | ||
| </section> | ||
| <section class="result-example"> | ||
| <h2 class="result-example__title">Живой пример</h2> | ||
| <p class="result-example__description">Борис сбросил 5 кг за 2 месяца, просто заменив свой обычный корм на Cat Energy Slim. Отличный результат без изнуряющих тренировок! При этом он не менял своих привычек и по-прежнему спит по 16 часов в день.</p> | ||
| <ul class="result-example__list"> | ||
| <li class="result-example__list list-item"> | ||
| <span class="list-item__value">5 кг</span> | ||
| <p class="list-item__label">снижение веса</p> | ||
| </li> | ||
| <li class="result-example__list list-item"> | ||
| <span class="list-item__value">60 дней</span> | ||
| <p class="list-item__label">затрачено времени</p> | ||
| </li> | ||
| </ul> | ||
| <p class="result-example__cost">Затраты на питание: 15 000 руб.</p> | ||
| <img class="result-example__image" src="#" width="280" height="256" alt="Кот: до и после"> | ||
|
There was a problem hiding this comment. тут явно не хватает разметки нужно и блок расположить и 2х котов отобразить, и разделитель и тд |
||
| </section> | ||
| <div class="adress-container"> | ||
| <p class="adress-container__offer">Приглашаем к сотрудничеству дилеров!</p> | ||
| <p class="adress-container__place">ул. Большая Конюшенная, д. 19/8 Санкт-Петербург</p> | ||
| </div> | ||
| <img class="map-image" src="#" width="320" height="362" alt="Карта с обозначением расположения магазина"> | ||
|
There was a problem hiding this comment. картинка карты сама по себе почему-то ожидается что будет блок, в котором будет контактная информация и карта |
||
| <footer class="footer"> | ||
| <svg class="footer__text-logo" width="128" height="24"></svg> | ||
|
|
||
| <ul class="socials-list"> | ||
| <li class="socials-list__item"> | ||
| <span class="visually-hidden">ВКонтакте</span> | ||
| </li> | ||
| <li class="socials-list__item"> | ||
| <span class="visually-hidden">YouTube</span> | ||
| </li> | ||
| <li class="socials-list__item"> | ||
| <span class="visually-hidden">Telegram</span> | ||
| </li> | ||
| </ul> | ||
| <div class="footer-logo-container"> | ||
| <p class="footer-logo-container__content">HTML Academy</p> | ||
| <span class="visually-hidden">Логотип HTML Academy</span> | ||
| </div> | ||
| </footer> | ||
| </main> | ||
| </body> | ||
|
|
||
| </html> | ||
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Остаповец Сергей