- Подложка в виде карты с маркерами (можно выбрать любую sdk карт);
- От нижнего края пальцем выдвигается шторка с полем ввода, которая после отпускания фиксируется в ближайшем из трех положений: нижнее, среднее и верхнее;
- В шторке также присутствуют несколько вкладок;
- В каждой вкладке вертикально прокручиваемый список (при прокрутке списка до верхнего края шторка тянется вниз, при прокрутке списка вниз шторка разворачивается в верхнее положение);
- При нажатии на поле ввода шторка разворачивается в верхнее положение.
- В качестве API карт использована библиотека Leaflet.
- Для управления пагинацией и свайпом категорий использована библиотека Swiper.
Эти не баги, но фичи, сделаны не от невозможности реализации, а из лучших побуждений:
- Зона контентных карточек не отзывается на перетаскивание шторок, так как это мешает при прокрутке контента.
- Тестируя на разных экранах, пришел к выводу, что полезной фичей будет упразднить среднее положение на экранах ниже 600px, что и сделано.
- Разворачивание по клику на поиск выполняется только в режиме нижнего положения, так как в среднем это губит визуалищацию динамики на карте.
vue3, vite, pinia, scss, postcss, eslint, stylelint, prettier
Требуется Node не ниже 16.x.
npm inpm run devВ режиме разработки доступна ссылка во внутренней сети роутера для тестирования в браузерах мобильных устройств.