diff --git a/public/assets/images/cutlings2.avif b/public/assets/images/cutlings2.avif new file mode 100644 index 0000000..f53dc6d Binary files /dev/null and b/public/assets/images/cutlings2.avif differ diff --git a/src/components/MainPageLayout.js b/src/components/MainPageLayout.js index 33a982b..796b75d 100644 --- a/src/components/MainPageLayout.js +++ b/src/components/MainPageLayout.js @@ -291,8 +291,22 @@ const MainPageLayout = () => { const currentPath = location.pathname; const { t } = useTranslation(); const [starHovered, setStarHovered] = React.useState(false); + + // State to track kiosk mode + const [isKiosk, setIsKiosk] = React.useState(() => window.growheadskiosk === true); + + // Listen for the custom event + React.useEffect(() => { + const handleKioskChange = () => { + setIsKiosk(window.growheadskiosk === true); + }; + + window.addEventListener('growheadskiosk-change', handleKioskChange); + return () => window.removeEventListener('growheadskiosk-change', handleKioskChange); + }, []); + const translatedContent = { - buildYourSet: t('sections.buildYourSet'), + buildYourSet: isKiosk ? 'Schau in den Stecklingskatalog' : t('sections.buildYourSet'), selectSeedRate: t('sections.selectSeedRate'), outdoorSeason: t('sections.outdoorSeason') }; @@ -317,7 +331,7 @@ const MainPageLayout = () => { const allContentBoxes = { home: [ { title: t('sections.seeds'), image: "/assets/images/seeds.avif", bgcolor: "#e1f0d3", link: "/Kategorie/Seeds" }, - { title: t('sections.konfigurator'), image: "/assets/images/konfigurator.avif", bgcolor: "#e8f5d6", link: "/Konfigurator" } + { title: isKiosk ? 'Stecklingskatalog' : t('sections.konfigurator'), image: isKiosk ? "/assets/images/cutlings2.avif" : "/assets/images/konfigurator.avif", bgcolor: "#e8f5d6", link: isKiosk ? "https://cloneheads.de" : "/Konfigurator" } ], aktionen: [ { title: t('sections.oilPress'), image: "/assets/images/presse.jpg", bgcolor: "#e1f0d3", link: "/Artikel/Graveda-10t-presse-tagesmiete-inkl-prepress-vorpressform" }, diff --git a/src/components/header/CategoryList.js b/src/components/header/CategoryList.js index a0037de..edef62b 100644 --- a/src/components/header/CategoryList.js +++ b/src/components/header/CategoryList.js @@ -197,7 +197,7 @@ class CategoryList extends Component { aria-label="Zur Startseite" onClick={isMobile ? this.handleMobileCategoryClick : undefined} sx={{ - fontSize: "0.75rem", + fontSize: "0.85rem", textTransform: "none", whiteSpace: "nowrap", opacity: 0.9, @@ -275,7 +275,7 @@ class CategoryList extends Component { aria-label="Neuheiten" onClick={isMobile ? this.handleMobileCategoryClick : undefined} sx={{ - fontSize: "0.75rem", + fontSize: "0.85rem", textTransform: "none", whiteSpace: "nowrap", opacity: 0.9, @@ -353,7 +353,7 @@ class CategoryList extends Component { aria-label={this.props.t ? this.props.t('navigation.soon') : 'Demnächst'} onClick={isMobile ? this.handleMobileCategoryClick : undefined} sx={{ - fontSize: "0.75rem", + fontSize: "0.85rem", textTransform: "none", whiteSpace: "nowrap", opacity: 0.9, @@ -435,7 +435,7 @@ class CategoryList extends Component { size="small" onClick={isMobile ? this.handleMobileCategoryClick : undefined} sx={{ - fontSize: "0.75rem", + fontSize: "0.85rem", textTransform: "none", whiteSpace: "nowrap", opacity: 0.9, @@ -506,7 +506,7 @@ class CategoryList extends Component { alignItems: "center", height: "33px", // Match small button height px: 1, - fontSize: "0.75rem", + fontSize: "0.85rem", opacity: 0.9, }} > @@ -522,7 +522,7 @@ class CategoryList extends Component { aria-label={this.props.t ? this.props.t('navigation.konfiguratorAria') : 'Zum Konfigurator'} onClick={isMobile ? this.handleMobileCategoryClick : undefined} sx={{ - fontSize: "0.75rem", + fontSize: "0.85rem", textTransform: "none", whiteSpace: "nowrap", opacity: 0.9, diff --git a/src/services/SocketManager.js b/src/services/SocketManager.js index 53f9b44..7ed9e4c 100644 --- a/src/services/SocketManager.js +++ b/src/services/SocketManager.js @@ -153,6 +153,12 @@ class SocketManager { auth: this._buildSocketAuth() }); + this._socket.on('kiosk', () => { + window.growheadskiosk = true; + window.dispatchEvent(new Event('growheadskiosk-change')); + console.warn('Kiosk mode enabled via socket event'); + }); + // Always refresh auth data before reconnect attempts. if (this._socket.io && this._socket.io.on) { this._socket.io.on('reconnect_attempt', () => {