Smart Home UIKit
https://yandex-shri-2018.github.io/entrance-task-2-2/
В верхней части страницы есть шапка. В ней находится логотип и главное меню. Для адресов ссылок используйте заглушку #.
В нижней части находится подвал. Он должен примыкать к нижней границе экрана, вне зависимости от количества контента на странице.
Вертикальный скролл есть только в мобильной версии, при прокрутке шапка остаётся на месте. Главное меню прячется за иконку ☰.
На странице отображаются три блока: «Главное», «Избранные сценарии», «Избранные устройства».
Блок «Главное» находится слева и занимает половину экрана. В нём в виде текста отображается состояние окон и дверей, температура в доме и на улице. Справа находится список ближайших запланированных сценариев, который можно листать по вертикали. На мобильных устройствах блок занимает всю ширину экрана, а список ближайших сценариев листается по горизонтали. Избранные сценарии Правую половину экрана занимает блок «Избранные сценарии». Сами сценарии отображаются в виде панелей фиксированного размера, которые расположены в три ряда. Цвет иконки показывает, активен ли сценарий сейчас.
Если все сценарии не помещаются в три ряда, то справа сверху появляются кнопки для постраничного листания.
Переход между страницами должен быть анимированным. Вид и параметры анимации выберите самостоятельно.
Устройства, как и сценарии, отображаются в виде панелей фиксированного размера. Они расположены в один ряд по всей ширине экрана. Если устройства не помещаются, справа над списком появляются кнопки для постраничного листания — как в списке сценариев. На мобильных устройствах вместо постраничного листания используется горизонтальная прокрутка списка. Список устройств можно фильтровать по комнатам и типам устройств. В мобильной версии фильтр отображается в виде меню. Для меню нет макета — реализуйте его на свое усмотрение.
При клике на устройство должен открываться попап управления им. Открытие попапа должно сопровождаться анимацией. Пример анимации есть в репозитории с макетами.
Яркость ламп и температура теплого пола выбираются при помощи слайдера. Термостатом можно управлять при помощи крутилки.
yarn install
yarn run serve
yarn run build
yarn run lint
yarn run test:unit
yarn run test:e2e