Merge version_1 into main #2
420
src/app/page.tsx
420
src/app/page.tsx
@@ -28,303 +28,145 @@ export default function LandingPage() {
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Keresés",
|
||||
id: "#search",
|
||||
},
|
||||
{
|
||||
name: "Szerkesztés",
|
||||
id: "#edit",
|
||||
},
|
||||
{
|
||||
name: "Vonalkódok",
|
||||
id: "#barcodes",
|
||||
},
|
||||
{
|
||||
name: "Support",
|
||||
id: "#support",
|
||||
},
|
||||
]}
|
||||
brandName="TOK KERESŐ"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{ name: "Keresés", id: "#search" },
|
||||
{ name: "Szerkesztés", id: "#edit" },
|
||||
{ name: "Vonalkódok", id: "#barcodes" },
|
||||
{ name: "Support", id: "#support" },
|
||||
]}
|
||||
brandName="TOK KERESŐ"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogo
|
||||
logoText="TOK KERESŐ"
|
||||
description="Hatékony készletnyilvántartás mobil kiegészítőkhöz. Gyors keresés, valós idejű készletkövetés és vonalkód alapú kezelés."
|
||||
buttons={[
|
||||
{
|
||||
text: "Keresés indítása",
|
||||
href: "#search",
|
||||
},
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/photovoltaics-factory-expert-using-tablet-test-solar-panel-designs_482257-119461.jpg?_wi=1"
|
||||
imageAlt="Inventory dashboard interface"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogo
|
||||
logoText="TOK KERESŐ"
|
||||
description="Hatékony készletnyilvántartás mobil kiegészítőkhöz. Gyors keresés, valós idejű készletkövetés és vonalkód alapú kezelés."
|
||||
buttons={[
|
||||
{ text: "Keresés indítása", href: "#search" },
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/photovoltaics-factory-expert-using-tablet-test-solar-panel-designs_482257-119461.jpg"
|
||||
imageAlt="Inventory dashboard interface"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="Modern készletkezelés"
|
||||
description="Rendszerünk lehetővé teszi a termékek, polcok és vonalkódok precíz kezelését. Felejtsd el a papíralapú nyilvántartást és válts át a digitális pontosságra."
|
||||
metrics={[
|
||||
{
|
||||
value: "100%",
|
||||
title: "Pontos nyilvántartás",
|
||||
},
|
||||
{
|
||||
value: "2.5s",
|
||||
title: "Átlagos keresési idő",
|
||||
},
|
||||
{
|
||||
value: "24/7",
|
||||
title: "Készlet elérhetőség",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/asian-employee-typing-tracking-info-from-airway-bill-labels-before-shipping-parcels-managing_482257-136323.jpg?_wi=1"
|
||||
imageAlt="Inventory management technology"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="Modern készletkezelés"
|
||||
description="Rendszerünk lehetővé teszi a termékek, polcok és vonalkódok precíz kezelését. Felejtsd el a papíralapú nyilvántartást és válts át a digitális pontosságra."
|
||||
metrics={[
|
||||
{ value: "100%", title: "Pontos nyilvántartás" },
|
||||
{ value: "2.5s", title: "Átlagos keresési idő" },
|
||||
{ value: "24/7", title: "Készlet elérhetőség" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/asian-employee-typing-tracking-info-from-airway-bill-labels-before-shipping-parcels-managing_482257-136323.jpg"
|
||||
imageAlt="Inventory management technology"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Gyors Keresés",
|
||||
description: "Keresés vonalkód vagy terméknév alapján másodpercek alatt.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/online-shopping-concept_23-2151896849.jpg",
|
||||
imageAlt: "Search interface",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-business-man-holding-tablet_23-2150103591.jpg",
|
||||
imageAlt: "Search interface",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photovoltaics-factory-expert-using-tablet-test-solar-panel-designs_482257-119461.jpg?_wi=2",
|
||||
imageAlt: "smart inventory grid on phone screen",
|
||||
},
|
||||
{
|
||||
title: "Vonalkód Kezelés",
|
||||
description: "Egyedi vonalkódok hozzárendelése minden termékhez a polcokhoz.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/business-woman-hand-with-financial-charts-mobile-phone-laptop-table_1232-4885.jpg",
|
||||
imageAlt: "Barcode interface",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/diverse-team-analyzing-goods-quality-control-report-tablet_482257-84290.jpg",
|
||||
imageAlt: "Barcode interface",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/asian-employee-typing-tracking-info-from-airway-bill-labels-before-shipping-parcels-managing_482257-136323.jpg?_wi=2",
|
||||
imageAlt: "smart inventory grid on phone screen",
|
||||
},
|
||||
{
|
||||
title: "Valós Idejű Szerkesztés",
|
||||
description: "Készletadatok frissítése valós időben, könnyen használható felületen.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/businesswoman-looking-green-screen-monitor-smartphone-sitting-desk-business-office-late-night-freelancer-watching-desktop-monitor-display-with-green-mockup-chroma-key-working-overtime_482257-13377.jpg",
|
||||
imageAlt: "Edit interface",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-young-man-working-smart-phone-laptop_1150-7561.jpg",
|
||||
imageAlt: "Edit interface",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-matchsticks-with-geometric-shapes_23-2149600201.jpg?_wi=1",
|
||||
imageAlt: "smart inventory grid on phone screen",
|
||||
},
|
||||
]}
|
||||
showStepNumbers={true}
|
||||
title="Hatékony funkciók"
|
||||
description="Minden, amire az üzletvezetéshez szükséged van egy képernyőn."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Gyors Keresés", description: "Keresés vonalkód vagy terméknév alapján másodpercek alatt.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/online-shopping-concept_23-2151896849.jpg", imageAlt: "Search interface" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/high-angle-business-man-holding-tablet_23-2150103591.jpg", imageAlt: "Search interface" }
|
||||
},
|
||||
{
|
||||
title: "Vonalkód Kezelés", description: "Egyedi vonalkódok hozzárendelése minden termékhez a polcokhoz.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/business-woman-hand-with-financial-charts-mobile-phone-laptop-table_1232-4885.jpg", imageAlt: "Barcode interface" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/diverse-team-analyzing-goods-quality-control-report-tablet_482257-84290.jpg", imageAlt: "Barcode interface" }
|
||||
},
|
||||
{
|
||||
title: "Valós Idejű Szerkesztés", description: "Készletadatok frissítése valós időben, könnyen használható felületen.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/businesswoman-looking-green-screen-monitor-smartphone-sitting-desk-business-office-late-night-freelancer-watching-desktop-monitor-display-with-green-mockup-chroma-key-working-overtime_482257-13377.jpg", imageAlt: "Edit interface" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-young-man-working-smart-phone-laptop_1150-7561.jpg", imageAlt: "Edit interface" }
|
||||
},
|
||||
]}
|
||||
showStepNumbers={true}
|
||||
title="Hatékony funkciók"
|
||||
description="Minden, amire az üzletvezetéshez szükséged van egy képernyőn."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
icon: Package,
|
||||
title: "Termék pozíció",
|
||||
value: "150+",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
icon: Box,
|
||||
title: "Vonalkód regisztrált",
|
||||
value: "450",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
icon: Clock,
|
||||
title: "Frissítve ma",
|
||||
value: "12",
|
||||
},
|
||||
]}
|
||||
title="Rendszer Statisztikák"
|
||||
description="Lásd az aktuális készletállapotokat és rendszeradatokat egy pillantással."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{ id: "m1", icon: Package, title: "Termék pozíció", value: "150+" },
|
||||
{ id: "m2", icon: Box, title: "Vonalkód regisztrált", value: "450" },
|
||||
{ id: "m3", icon: Clock, title: "Frissítve ma", value: "12" },
|
||||
]}
|
||||
title="Rendszer Statisztikák"
|
||||
description="Lásd az aktuális készletállapotokat és rendszeradatokat egy pillantással."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
brand: "Samsung",
|
||||
name: "S26 Ultra Tok",
|
||||
price: "Raktáron",
|
||||
rating: 5,
|
||||
reviewCount: "12",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-matchsticks-with-geometric-shapes_23-2149600201.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
brand: "iPhone",
|
||||
name: "17 Pro Max Tok",
|
||||
price: "Raktáron",
|
||||
rating: 5,
|
||||
reviewCount: "8",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/white-cell-phone-box-background_58702-4693.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
brand: "Xiaomi",
|
||||
name: "Redmi Note 15 Tok",
|
||||
price: "Raktáron",
|
||||
rating: 4,
|
||||
reviewCount: "22",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/minimalist-tech-setup-with-nvme-ssd_58702-17232.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
brand: "Honor",
|
||||
name: "Magic 7 Tok",
|
||||
price: "Raktáron",
|
||||
rating: 5,
|
||||
reviewCount: "5",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-round-gray-wall-clock-isolated-white-background_187299-47159.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
brand: "Egyéb",
|
||||
name: "Univerzális Tok",
|
||||
price: "Raktáron",
|
||||
rating: 4,
|
||||
reviewCount: "19",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-set-up-streaming_23-2148860617.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
brand: "Könyv",
|
||||
name: "Prémium Könyv Tok",
|
||||
price: "Raktáron",
|
||||
rating: 5,
|
||||
reviewCount: "11",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-using-pair-smart-glasses_23-2149107960.jpg",
|
||||
},
|
||||
]}
|
||||
title="Készletkategóriák"
|
||||
description="Tekintsd át főbb termékkategóriáinkat."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", brand: "Samsung", name: "S26 Ultra Tok", price: "Raktáron", rating: 5, reviewCount: "12", imageSrc: "http://img.b2bpic.net/free-photo/view-matchsticks-with-geometric-shapes_23-2149600201.jpg" },
|
||||
{ id: "p2", brand: "iPhone", name: "17 Pro Max Tok", price: "Raktáron", rating: 5, reviewCount: "8", imageSrc: "http://img.b2bpic.net/free-photo/white-cell-phone-box-background_58702-4693.jpg" },
|
||||
{ id: "p3", brand: "Xiaomi", name: "Redmi Note 15 Tok", price: "Raktáron", rating: 4, reviewCount: "22", imageSrc: "http://img.b2bpic.net/free-photo/minimalist-tech-setup-with-nvme-ssd_58702-17232.jpg" },
|
||||
{ id: "p4", brand: "Honor", name: "Magic 7 Tok", price: "Raktáron", rating: 5, reviewCount: "5", imageSrc: "http://img.b2bpic.net/free-photo/close-up-round-gray-wall-clock-isolated-white-background_187299-47159.jpg" },
|
||||
{ id: "p5", brand: "Egyéb", name: "Univerzális Tok", price: "Raktáron", rating: 4, reviewCount: "19", imageSrc: "http://img.b2bpic.net/free-photo/close-up-set-up-streaming_23-2148860617.jpg" },
|
||||
{ id: "p6", brand: "Könyv", name: "Prémium Könyv Tok", price: "Raktáron", rating: 5, reviewCount: "11", imageSrc: "http://img.b2bpic.net/free-photo/man-using-pair-smart-glasses_23-2149107960.jpg" },
|
||||
]}
|
||||
title="Készletkategóriák"
|
||||
description="Tekintsd át főbb termékkategóriáinkat."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Hogyan rendelhetek vonalkódot?",
|
||||
content: "Navigálj a Vonalkódok fülre, add meg a kódot és válaszd ki a célcellát.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Módosítható egy terméknév?",
|
||||
content: "Igen, a Szerkesztés fülön kattints a megfelelő cellára és írd át az adatokat.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Hogyan kereshetek?",
|
||||
content: "Használd a keresőmezőt a főoldalon, írd be a kódot vagy a termék nevét.",
|
||||
},
|
||||
]}
|
||||
title="Gyakori kérdések"
|
||||
description="Segítség a rendszer használatához."
|
||||
faqsAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/professional-person-engaging-with-ai-chatbot-computer-screen_482257-126263.jpg"
|
||||
imageAlt="Support and FAQ representative"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "f1", title: "Hogyan rendelhetek vonalkódot?", content: "Navigálj a Vonalkódok fülre, add meg a kódot és válaszd ki a célcellát." },
|
||||
{ id: "f2", title: "Módosítható egy terméknév?", content: "Igen, a Szerkesztés fülön kattints a megfelelő cellára és írd át az adatokat." },
|
||||
{ id: "f3", title: "Hogyan kereshetek?", content: "Használd a keresőmezőt a főoldalon, írd be a kódot vagy a termék nevét." },
|
||||
]}
|
||||
title="Gyakori kérdések"
|
||||
description="Segítség a rendszer használatához."
|
||||
faqsAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/professional-person-engaging-with-ai-chatbot-computer-screen_482257-126263.jpg"
|
||||
imageAlt="Support and FAQ representative"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
text="Technikai segítségre van szükséged? Vedd fel velünk a kapcsolatot az adminisztrációs panelen keresztül."
|
||||
buttons={[
|
||||
{
|
||||
text: "Üzenet küldése",
|
||||
href: "mailto:support@tokkereso.hu",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
text="Technikai segítségre van szükséged? Vedd fel velünk a kapcsolatot az adminisztrációs panelen keresztül."
|
||||
buttons={[
|
||||
{ text: "Üzenet küldése", href: "mailto:support@tokkereso.hu" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Rendszer",
|
||||
items: [
|
||||
{
|
||||
label: "Keresés",
|
||||
href: "#search",
|
||||
},
|
||||
{
|
||||
label: "Admin",
|
||||
href: "#edit",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Támogatás",
|
||||
items: [
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#support",
|
||||
},
|
||||
{
|
||||
label: "Kapcsolat",
|
||||
href: "mailto:support@tokkereso.hu",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="TOK KERESŐ"
|
||||
copyrightText="© 2025 | Tok Kereső Rendszer"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{ title: "Rendszer", items: [{ label: "Keresés", href: "#search" }, { label: "Admin", href: "#edit" }] },
|
||||
{ title: "Támogatás", items: [{ label: "FAQ", href: "#support" }, { label: "Kapcsolat", href: "mailto:support@tokkereso.hu" }] },
|
||||
]}
|
||||
logoText="TOK KERESŐ"
|
||||
copyrightText="© 2025 | Tok Kereső Rendszer"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user