Перед выполнением задания внимательно прочитайте:
- О всех этапах проверки задания
- Как отправить пулл
- Как пройти тесты
- Правила оформления JavaScript, HTML и CSS кода
Задание необходимо решить без использования JS
Ваша задача на сегодня – сверстать главную страницу Яндекса (картинки кликабельны).
Требования:
- Использовать для разметки grid layout
- Как можно более точно соответствовать макету (изображения можно взять другие)
- В виджете «Автомобильные новости» контента много: там есть скролл с затенениями сверху и снизу
- Верстка должна соответствовать методологии BEM
Как вы могли заметить, анекдот в виджете «Лучшие анекдоты» не самый смешной, поэтому вам предлагается выбрать свои 5 любимых анекдотов и сделать так, чтобы по нажатию на кнопку «Показать еще», они менялись между собой.
Кроме того, кому-то могут быть вообще неинтересны анекдоты или, например, телепрограмма. Поэтому стоит дать пользователю возможность убирать ненужные виджеты.
При нажатии на «Настройка» появляется окно, в котором можно выбрать отображаемые виджеты:
Если снять галочку, то виджет должен пропасть со страницы:
Если все виджеты из колонки не отображаются, то правые колонки должны съехать левее:
