shop-server/docs/superpowers/plans/2026-05-14-ui-style-refresh.md

UI Style Refresh — Implementation Plan

Goal: Замена иконок MUI→Lucide, редизайн темы/слайдера/фильтров/кнопок, VK в футер.

Architecture: 6 независимых этапов: подготовка (package.json, config), замена иконок в ~12 файлах, визуальный редизайн 3 компонентов.

Tech Stack: React, MUI, Lucide React

---

Task A1: package.json + shared/config

• Удалить @mui/icons-material из package.json
• Заменить STORE_SOCIAL_NOTE на VK_URL в config

Task A2: MUI-тема (AppProviders)

• Добавить components.MuiButton styleOverrides (тени, hover)
• Добавить components.MuiIconButton styleOverrides (scale)

Task B3: Хедер + меню

• AppHeader.tsx — Menu, Package (lucide)
• CartBadge.tsx — ShoppingCart (lucide)
• UserMenu.tsx — User (lucide)
• ToggleCartIcon.tsx — ShoppingCart, ShoppingCartOff (lucide)

Task B4: Админка

• AdminLayoutPage.tsx — Store, LayoutGrid, Image, ListOrdered, MessageSquare, People, FileText (lucide)

Task B5: Личный кабинет

• MeLayoutPage.tsx — Truck, MessageCircle, Settings, MapPin, SlidersHorizontal (lucide)

Task B6: Остальные иконки

• ProductPage.tsx — Star, X (lucide)
• CartPage.tsx — Plus, Minus, Trash2 (lucide)
• ModeSwitcher.tsx — Sun, Moon, Monitor (lucide, 3 режима)
• SchemeSwitcher.tsx — без bgcolor, цветная обводка
• RichTextMessageEditor.tsx — Bold, Italic, List (lucide)

Task C7: VK в футер

• MainLayout.tsx — кастомный SvgIcon VK, удалить SOCIAL_NOTE

Task C8: ProductFilters (каталог)

• Search с иконкой, Chips категорий, компактные фильтры

Task C9: CatalogSlider (слайдер)

• Подложка с градиентом, новый стиль текста