Для разработки нужно использовать рабочий проект с настроенным билдом (gulp, sass, fileinclude).
На входе вам будет предоставлен доступ в репозиторий на GitHub, работу нужно будет выполнить в указанной ветке. Репозиторий подготовлен, проект запускается. Вёрстка необходима для конкретной страницы, примеры реализации в репозитории есть.
Есть макет в Figma с наличием двух вариантов под десктопную и мобильную версию. Хеадер и футер (выделены красной рамкой) уже реализованы — верстать не нужно, необходимо сверстать только тело страницы.
1. Вёрстка должна быть адаптивной для двух ширин:
- от 0 до 991px — мобильная версия
- от 992px и шире — десктопная версия
1. Все стили описываются в main.sass и media.sass
1. Преимущественно для разметки использовать флексбоксы
1. Все растровые изображения должны быть встроены с помощью lazyload, можно использовать сниппет по аналогии с уже реализованными частями
1. Разметка должна быть логично разбита по блокам с помощью fileinclude, по аналогии с реализованными частями
1. На странице должны быть реализованы интерактивные элементы:
- переключение табы для скриншотов
- блоки "Show more", раскрывающие скрытую часть текста
- карусели для отзывов на slick.js, есть примеры
1. Вёрстка должна быть одинаково рабочей в современных браузерах и будет проверяться в последних стабильных релизах Safari, Mozzila, Chrome. Плюс в Safari/Chrome на iOS и Mozzila/Chrome в Android.
Во вложении скриншоты макета Figma для визуального ознакомления. Реальный макет по запросу.
