В Fruit Store - готовы каталог и карточка товара Продолжаю доводить дизайн до конца.
Что нового:
• Собрал каталог категорий: карточки товаров, сортировка через shadcn Select с кастомной анимацией, пагинация
• Реализовал полный набор фильтров - диапазон цены со Slider'ом, чекбоксы для атрибутов, цветные свотчи с реальными HEX-значениями с бэка, все с плавным сворачиванием/разворачиванием
• Адаптировал фильтры под мобильные - на десктопе сайдбар всегда виден, на узких экранах прячутся за кнопкой и выезжают снизу через Sheet
• Переделал детальную страницу товара с нуля: галерея с каруселью и миниатюрами, переключение параметров через URL (без клиентского состояния - можно поделиться прямой ссылкой на конкретный вариант)
• Продумал и реализовал состояния для недоступных комбинаций атрибутов - если сочетания атрибутов не существует, кнопка выбора неактивна; если товар просто раскуплен, выбрать его можно, но кнопка покупки будет - "Нет в наличии"
•Добавил iPad и AirPods в конфигурацию фильтров и переключателей вариантов, с нужными атрибутами под каждую категорию
Больше всего времени ушло на разбор UX для раскупленных товаров - на бумаге кажется мелочью, но даже крупные площадки используют разные подходы.
Дальше по плану: личный кабинет, корзина и чекаут - последние страницы, которым нужен тот же уровень дизайна, а после них перехожу к деплою.
Летим дальше
