revert(catalog): ripristina catalogo Hippiehotel.nl (Modern+Classic)

Rimpiazza il catalogo del rebuild upstream con quello originale di
Hippiehotel.nl Nitro-V3 (CatalogModernView ripristinato, ClassicView/
sub-views/CSS pre-merge). CatalogView sceglie Modern (default) o Classic
via il toggle 'stile classico'. Rimosso l'hack CatalogClassicLegacy.css.
This commit is contained in:
medievalshell
2026-05-29 23:49:10 +02:00
parent 32dcbaf265
commit 2b8aca23b6
10 changed files with 465 additions and 852 deletions
@@ -1,5 +1,5 @@
import { FC } from 'react';
import { FaEdit, FaPlus, FaPowerOff, FaSyncAlt } from 'react-icons/fa';
import { FaEdit, FaPlus } from 'react-icons/fa';
import { GetConfigurationValue, LocalizeText, ProductTypeEnum, SanitizeHtml } from '../../../../../api';
import { Text } from '../../../../../common';
import { useCatalogData } from '../../../../../hooks';
@@ -17,12 +17,13 @@ import { CatalogLayoutProps } from './CatalogLayout.types';
export const CatalogLayoutDefaultView: FC<CatalogLayoutProps> = props =>
{
const { page = null } = props;
const { currentOffer = null, currentPage = null, roomPreviewer = null } = useCatalogData();
const { currentOffer = null, currentPage = null } = useCatalogData();
const catalogAdmin = useCatalogAdmin();
const adminMode = catalogAdmin?.adminMode ?? false;
return (
<div className="nitro-catalog-classic-default-layout flex flex-col h-full gap-2">
{ /* Admin: quick actions */ }
{ adminMode && !catalogAdmin.editingPageData &&
<div className="flex gap-2 nitro-catalog-classic-default-admin">
<button
@@ -41,24 +42,23 @@ export const CatalogLayoutDefaultView: FC<CatalogLayoutProps> = props =>
<FaPlus className="text-[10px]" /> { LocalizeText('catalog.admin.offer.new') }
</button>
</div> }
{ /* Product detail card */ }
{ currentOffer &&
<div className="nitro-catalog-classic-offer-panel flex gap-0 shrink-0">
<div className="nitro-catalog-classic-offer-panel flex gap-0 overflow-hidden">
{ /* Preview area */ }
<div className="nitro-catalog-classic-offer-preview relative flex items-center justify-center">
{ (currentOffer.product.productType !== ProductTypeEnum.BADGE) &&
<>
<button className="nitro-catalog-classic-preview-btn nitro-catalog-classic-preview-rotate" onClick={ () => roomPreviewer?.changeRoomObjectDirection() }>
<FaSyncAlt /> Rotate
</button>
<button className="nitro-catalog-classic-preview-btn nitro-catalog-classic-preview-state" onClick={ () => roomPreviewer?.changeRoomObjectState() }>
<FaPowerOff /> Toggle State
</button>
<CatalogViewProductWidgetView />
<CatalogAddOnBadgeWidgetView className="bg-muted rounded bottom-1 right-1 absolute" />
</> }
{ (currentOffer.product.productType === ProductTypeEnum.BADGE) &&
<CatalogAddOnBadgeWidgetView className="scale-2" /> }
</div>
{ /* Product info + purchase */ }
<div className="nitro-catalog-classic-offer-info flex flex-col flex-1 min-w-0 gap-2">
{ /* Title row */ }
<div>
<div className="flex items-start justify-between gap-2">
<Text className="text-[13px]! font-bold text-dark leading-tight">{ currentOffer.localizationName }</Text>
@@ -77,16 +77,19 @@ export const CatalogLayoutDefaultView: FC<CatalogLayoutProps> = props =>
</div> }
<CatalogLimitedItemWidgetView />
</div>
{ /* Price */ }
<CatalogTotalPriceWidget />
{ /* Spinner */ }
<CatalogSpinnerWidgetView />
<div className="nitro-catalog-classic-offer-actions flex gap-1.5">
{ /* Actions */ }
<div className="flex gap-1.5 mt-auto">
<CatalogPurchaseWidgetView />
</div>
</div>
</div> }
{ !currentOffer &&
<div className="nitro-catalog-classic-welcome flex items-center gap-3 shrink-0">
<div className="nitro-catalog-classic-welcome flex items-center gap-3">
{ !!page.localization.getImage(1) &&
<img className="w-[70px] h-[70px] object-contain rounded shrink-0" src={ page.localization.getImage(1) } /> }
<Text className="text-[11px]! text-muted" dangerouslySetInnerHTML={ { __html: SanitizeHtml(page.localization.getText(0)) } } />
@@ -58,11 +58,9 @@ export const CatalogLayoutTrophiesView: FC<CatalogLayoutProps> = props =>
</button>
</div> }
{ /* Selected trophy card. shrink-0 + no overflow-hidden so the
Buy button stays inside the panel even when the grid below
holds many trophies. */ }
{ /* Selected trophy card */ }
{ currentOffer
? <div className="flex gap-0 bg-white rounded border-2 border-warning/40 shrink-0" style={ { boxShadow: '0 0 8px rgba(255,193,7,0.15)' } }>
? <div className="flex gap-0 bg-white rounded border-2 border-warning/40 overflow-hidden" style={ { boxShadow: '0 0 8px rgba(255,193,7,0.15)' } }>
{ /* Preview */ }
<div className="w-[120px] min-w-[120px] relative flex items-center justify-center border-r-2 border-warning/30" style={ { background: 'linear-gradient(180deg, #fff9e6 0%, #fff3cc 100%)' } }>
{ (currentOffer.product.productType !== ProductTypeEnum.BADGE)
@@ -92,7 +90,7 @@ export const CatalogLayoutTrophiesView: FC<CatalogLayoutProps> = props =>
<CatalogTotalPriceWidget />
{ !canPurchase &&
<span className="text-[9px] text-warning italic">{ LocalizeText('catalog.trophies.write.hint') }</span> }
<div className="flex gap-1.5">
<div className="flex gap-1.5 mt-auto">
<CatalogPurchaseWidgetView />
</div>
</div>