11 derectives #277
11 derectives #277
Conversation
| .card { | ||
| display: flex; | ||
| flex-wrap: wrap; | ||
| justify-content: space-between; |
There was a problem hiding this comment.
Респонсивность - ✅
мне кажется так будет симпатичнее
| @@ -0,0 +1,3 @@ | |||
| .card_container { | |||
There was a problem hiding this comment.
странное название класса, как-то не по БЭМУ.
У меня к тебе предложение: всё, что относится к странице в целом и раскладке карточек (ul) - оставим в родителе app.component или, что будет лучше, отдельном компоненте cards-list
Он же будет запрашивать через сервис список рецептов, и отрисовывать "обвес"
А каждая карточка у нас будет отдельным реюзаемым компонетом(li), которая будет получать свой рецепт от родителя и отрисовывать его.
There was a problem hiding this comment.
Напомню БЭМ:
.блок
.блок.блок--модификатор-блока
.блок__элемент
.блок__элемент.блок__элемент--модификатор-элемента
...
.блок-из-нескольких-слов
.блок-из-нескольких-слов__элемент-из-нескольких-слов
Отделять одиночным подчёркиванием _ - не рекомендуется.
There was a problem hiding this comment.
З БЕМом я тут натупив))) але зараз роблю свій невиликий проект там стараюсь використовувати все що ти підказуєш, так краще запам'ятовується. Він на стадії розробки, але якщо буде цікаво, і буде час то можеш глянути)))
https://sansandru4.github.io/IntroligaTOR/index.html
There was a problem hiding this comment.
Ого, там всё серьёзно, как я погляжу
| <p><strong>Food pairing:</strong> {{recept.food_pairing}}</p> | ||
| </div> | ||
| <div class="card_ingredients"> | ||
| <p><strong>Ingredients:</strong> {{recept.ingredients}}</p> |
There was a problem hiding this comment.
Вот тут для ингредиентов и надо заюзать кастомный пайп. Как его создать и для чего, рассказывал Мирон на лекции.
There was a problem hiding this comment.
Если вкрадце, то этот кастомный пайп должен принимать на вход объект ингридиентов и выводить их имена списком.
| <p><strong>Ingredients:</strong> {{recept.ingredients}}</p> | ||
| </div> | ||
| <div class="card_time"> | ||
| <p><strong>Time to cook: </strong></p> |
There was a problem hiding this comment.
Тут тоже нужен кастомный пайп. Почитай в задании, что он должен делать.
There was a problem hiding this comment.
Потом, на основании этого времени, надо будет добавить лейбу на карточку с рецептом.
| @@ -16,6 +16,7 @@ | |||
| "@angular-eslint/eslint-plugin": "^13.0.1", | |||
There was a problem hiding this comment.
Эти два файла лучше удалить из твоего пулл-реквеста. Они лежат в корне всего проекта, а не в твоей папке, и создают конфликты.
Верни их к первоначальному состоянию, и закоммить изменения.
|
Молодец. Начало положено.
|
No description provided.