feat(catalog): complete UI redesign with admin mode & favorites

- Modern card-based layout with vertical icon rail, breadcrumb nav, inline search
- Admin mode: edit/create/delete pages and offers, drag & drop reorder via HK API
- Favorites system: heart on furni, star on pages, localStorage persistence
- Redesigned product card with price pills, dynamic quantity spinner
- Upgraded trophies (filter tabs, parchment textarea), pets (breed/color flow),
  custom prefix (dynamic color boxes)
- Font fix: Ubuntu Regular, proper @font-face declarations
- New Tailwind design tokens and CatalogTexts.json for localization
This commit is contained in:
simoleo89
2026-03-21 16:49:35 +01:00
parent d18742d294
commit 74dce1d55d
25 changed files with 1891 additions and 296 deletions
@@ -1,8 +1,6 @@
import { FC } from 'react';
import { ICatalogNode } from '../../../../api';
import { AutoGrid, Column } from '../../../../common';
import { useCatalog } from '../../../../hooks';
import { CatalogSearchView } from '../page/common/CatalogSearchView';
import { CatalogNavigationItemView } from './CatalogNavigationItemView';
import { CatalogNavigationSetView } from './CatalogNavigationSetView';
@@ -17,18 +15,13 @@ export const CatalogNavigationView: FC<CatalogNavigationViewProps> = props =>
const { searchResult = null } = useCatalog();
return (
<>
<CatalogSearchView />
<Column fullHeight className="border-[#b6bec5]! bg-[#cdd3d9] border-2 border-[solid] rounded p-1" overflow="hidden">
<AutoGrid columnCount={ 1 } gap={ 1 } id="nitro-catalog-main-navigation">
{ searchResult && (searchResult.filteredNodes.length > 0) && searchResult.filteredNodes.map((n, index) =>
{
return <CatalogNavigationItemView key={ index } node={ n } />;
}) }
{ !searchResult &&
<CatalogNavigationSetView node={ node } /> }
</AutoGrid>
</Column>
</>
<div className="flex flex-col gap-px px-0.5 py-0.5">
{ searchResult && (searchResult.filteredNodes.length > 0) && searchResult.filteredNodes.map((n, index) =>
{
return <CatalogNavigationItemView key={ index } node={ n } />;
}) }
{ !searchResult &&
<CatalogNavigationSetView node={ node } /> }
</div>
);
};