origin/summary-task/90-c-gek-kezel-se #24
+2
-1
@@ -1,5 +1,6 @@
|
|||||||
|
|
||||||
/* build-hook-start *//*00001*/try { require('c:\\Users\\magdo\\.vscode\\extensions\\wallabyjs.console-ninja-1.0.467\\out\\buildHook\\index.js').default({tool: 'jest', checkSum: '204df79fd8f170c051d838B1RIBxdTXgwCCQEIAQMHU1MJCltS', mode: 'build'}); } catch(cjsError) { try { import('file:///c:/Users/magdo/.vscode/extensions/wallabyjs.console-ninja-1.0.467/out/buildHook/index.js').then(m => m.default.default({tool: 'jest', checkSum: '204df79fd8f170c051d838B1RIBxdTXgwCCQEIAQMHU1MJCltS', mode: 'build'})).catch(esmError => {}) } catch(esmError) {}}/* build-hook-end */
|
/* build-hook-start *//*00001*/try { require('c:\\Users\\magdo\\.vscode\\extensions\\wallabyjs.console-ninja-1.0.467\\out\\buildHook\\index.js').default({tool: 'jest', checkSum: '204f4cda3b14e070d28dfdB1YaU0pUCQQCUgcFDgdcVFpXAlEF', mode: 'build'}); } catch(cjsError) { try { import('file:///c:/Users/magdo/.vscode/extensions/wallabyjs.console-ninja-1.0.467/out/buildHook/index.js').then(m => m.default.default({tool: 'jest', checkSum: '204f4cda3b14e070d28dfdB1YaU0pUCQQCUgcFDgdcVFpXAlEF', mode: 'build'})).catch(esmError => {}) } catch(esmError) {}}/* build-hook-end */
|
||||||
|
|
||||||
/*!
|
/*!
|
||||||
* /**
|
* /**
|
||||||
* * Copyright (c) Meta Platforms, Inc. and affiliates.
|
* * Copyright (c) Meta Platforms, Inc. and affiliates.
|
||||||
|
|||||||
+2
-1
@@ -1,5 +1,6 @@
|
|||||||
#!/usr/bin/env node
|
#!/usr/bin/env node
|
||||||
/* build-hook-start *//*00001*/try { require('c:\\Users\\magdo\\.vscode\\extensions\\wallabyjs.console-ninja-1.0.467\\out\\buildHook\\index.js').default({tool: 'jest', checkSum: '204df79fd8f170c051d838B1RIBxdTXgwCCQEIAQMHU1MJCltS', mode: 'build'}); } catch(cjsError) { try { import('file:///c:/Users/magdo/.vscode/extensions/wallabyjs.console-ninja-1.0.467/out/buildHook/index.js').then(m => m.default.default({tool: 'jest', checkSum: '204df79fd8f170c051d838B1RIBxdTXgwCCQEIAQMHU1MJCltS', mode: 'build'})).catch(esmError => {}) } catch(esmError) {}}/* build-hook-end */
|
/* build-hook-start *//*00001*/try { require('c:\\Users\\magdo\\.vscode\\extensions\\wallabyjs.console-ninja-1.0.467\\out\\buildHook\\index.js').default({tool: 'jest', checkSum: '204f4cda3b14e070d28dfdB1YaU0pUCQQCUgcFDgdcVFpXAlEF', mode: 'build'}); } catch(cjsError) { try { import('file:///c:/Users/magdo/.vscode/extensions/wallabyjs.console-ninja-1.0.467/out/buildHook/index.js').then(m => m.default.default({tool: 'jest', checkSum: '204f4cda3b14e070d28dfdB1YaU0pUCQQCUgcFDgdcVFpXAlEF', mode: 'build'})).catch(esmError => {}) } catch(esmError) {}}/* build-hook-end */
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
||||||
|
|||||||
Generated
+50
-1025
File diff suppressed because it is too large
Load Diff
@@ -9,6 +9,7 @@ import ResetPassword from "./pages/Auth/ResetPassword"
|
|||||||
import Landingpage from "./pages/Landing/Landingpage"
|
import Landingpage from "./pages/Landing/Landingpage"
|
||||||
import Home from "./pages/Landing/Home"
|
import Home from "./pages/Landing/Home"
|
||||||
import DeckManagerPage from "./pages/Decks/DeckManagerPage"
|
import DeckManagerPage from "./pages/Decks/DeckManagerPage"
|
||||||
|
import CompanyHub from "./pages/Companies/Companies"
|
||||||
import About from "./pages/About/About"
|
import About from "./pages/About/About"
|
||||||
import ScrollToTop from "./components/ScrollToTop";
|
import ScrollToTop from "./components/ScrollToTop";
|
||||||
|
|
||||||
@@ -40,22 +41,21 @@ function App() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<Router>
|
<Router>
|
||||||
<Routes>
|
<Routes>
|
||||||
<Route path="/about" element={<About />} />
|
<Route path="/about" element={<About />} />
|
||||||
<Route path="/register" element={<AuthRegister />} />
|
<Route path="/register" element={<AuthRegister />} />
|
||||||
<Route path="/login" element={<AuthLogin />} />
|
<Route path="/login" element={<AuthLogin />} />
|
||||||
<Route path="/verify-email" element={<EmailVerification />} />
|
<Route path="/verify-email" element={<EmailVerification />} />
|
||||||
<Route path="/forgot-password" element={<ForgotPassword />} />
|
<Route path="/forgot-password" element={<ForgotPassword />} />
|
||||||
<Route path="/reset-password" element={<ResetPassword />} />
|
<Route path="/reset-password" element={<ResetPassword />} />
|
||||||
<Route path="/test" element={<Test />} />
|
<Route path="/test" element={<Test />} />
|
||||||
<Route path="/" element={<Landingpage />} />
|
<Route path="/" element={<Landingpage />} />
|
||||||
<Route path="/home" element={<Home />} />
|
<Route path="/home" element={<Home />} />
|
||||||
<Route path="/decks" element={<DeckManagerPage />} />
|
<Route path="/decks" element={<DeckManagerPage />} />
|
||||||
{/* Add more routes as needed */}
|
<Route path="/companies" element={<CompanyHub />} />
|
||||||
</Routes>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
{/* Add more routes as needed */}
|
||||||
|
</Routes>
|
||||||
</Router>
|
</Router>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,6 +1,3 @@
|
|||||||
// src/assets/backgrounds/Background.jsx
|
|
||||||
// Kockás háttér, ami a mousemovera reagál
|
|
||||||
|
|
||||||
import React, { useEffect, useState } from "react"
|
import React, { useEffect, useState } from "react"
|
||||||
import { motion } from "framer-motion"
|
import { motion } from "framer-motion"
|
||||||
|
|
||||||
@@ -13,8 +10,8 @@ const Background = () => {
|
|||||||
const updateGrid = () => {
|
const updateGrid = () => {
|
||||||
const width = window.innerWidth
|
const width = window.innerWidth
|
||||||
const height = window.innerHeight
|
const height = window.innerHeight
|
||||||
const cols = Math.max(8, Math.floor(width / 100)) // 100px-es cellák
|
const cols = Math.max(8, Math.floor(width / 100))
|
||||||
const rows = Math.max(5, Math.floor(height / 100)) // 100px-es cellák
|
const rows = Math.max(5, Math.floor(height / 100))
|
||||||
setGridSize({ cols, rows })
|
setGridSize({ cols, rows })
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -37,26 +34,19 @@ const Background = () => {
|
|||||||
const newCol = Math.floor(Math.random() * gridSize.cols)
|
const newCol = Math.floor(Math.random() * gridSize.cols)
|
||||||
const newRow = Math.floor(Math.random() * gridSize.rows)
|
const newRow = Math.floor(Math.random() * gridSize.rows)
|
||||||
setPath((prevPath) => {
|
setPath((prevPath) => {
|
||||||
const newPath = [...prevPath, { col: newCol, row: newRow, opacity: 1 }] // Új pont hozzáadása
|
const newPath = [...prevPath, { col: newCol, row: newRow, opacity: 1 }]
|
||||||
if (newPath.length > 10) {
|
if (newPath.length > 10) newPath.shift()
|
||||||
newPath.shift() // Max 10 pont az útvonalon
|
|
||||||
}
|
|
||||||
return newPath
|
return newPath
|
||||||
})
|
})
|
||||||
}, 500) // Új pont hozzáadása minden 500ms-ben
|
}, 500)
|
||||||
|
|
||||||
// Az útvonal pontjainak fokozatos eltűnése
|
|
||||||
const fadeInterval = setInterval(() => {
|
const fadeInterval = setInterval(() => {
|
||||||
setPath(
|
setPath((prevPath) =>
|
||||||
(prevPath) =>
|
prevPath
|
||||||
prevPath
|
.map((point) => ({ ...point, opacity: Math.max(0, point.opacity - 0.05) }))
|
||||||
.map((point) => ({
|
.filter((point) => point.opacity > 0)
|
||||||
...point,
|
|
||||||
opacity: Math.max(0, point.opacity - 0.05), // Fokozatosan csökkentjük az opacity-t
|
|
||||||
}))
|
|
||||||
.filter((point) => point.opacity > 0) // Eltávolítjuk a teljesen eltűnt pontokat
|
|
||||||
)
|
)
|
||||||
}, 100) // Opacity frissítése minden 100ms-ben
|
}, 100)
|
||||||
|
|
||||||
return () => {
|
return () => {
|
||||||
clearInterval(interval)
|
clearInterval(interval)
|
||||||
@@ -82,9 +72,8 @@ const Background = () => {
|
|||||||
const dx = cellX - mousePos.x
|
const dx = cellX - mousePos.x
|
||||||
const dy = cellY - mousePos.y
|
const dy = cellY - mousePos.y
|
||||||
const distance = Math.sqrt(dx * dx + dy * dy)
|
const distance = Math.sqrt(dx * dx + dy * dy)
|
||||||
const distanceFactor = Math.max(0, 1 - distance / 300) // Egér hatótávolsága
|
const distanceFactor = Math.max(0, 1 - distance / 300)
|
||||||
|
|
||||||
// Az útvonalban lévő pontok opacitása
|
|
||||||
const pathPoint = path.find((p) => p.col === col && p.row === row)
|
const pathPoint = path.find((p) => p.col === col && p.row === row)
|
||||||
const pathOpacity = pathPoint ? pathPoint.opacity : 0
|
const pathOpacity = pathPoint ? pathPoint.opacity : 0
|
||||||
|
|
||||||
@@ -93,10 +82,10 @@ const Background = () => {
|
|||||||
key={i}
|
key={i}
|
||||||
className="w-full h-full bg-white rounded-lg"
|
className="w-full h-full bg-white rounded-lg"
|
||||||
animate={{
|
animate={{
|
||||||
opacity: 0.05 + distanceFactor * 0.2 + pathOpacity * 0.5, // Kombinált opacitás
|
opacity: 0.05 + distanceFactor * 0.2 + pathOpacity * 0.5,
|
||||||
scale: 1 + distanceFactor * 0.05 + pathOpacity * 0.1, // Kombinált skálázás
|
scale: 1 + distanceFactor * 0.05 + pathOpacity * 0.1,
|
||||||
}}
|
}}
|
||||||
transition={{ duration: 0.5, ease: "easeOut" }} // Lassú és sima átmenet
|
transition={{ duration: 0.5, ease: "easeOut" }}
|
||||||
/>
|
/>
|
||||||
)
|
)
|
||||||
})}
|
})}
|
||||||
|
|||||||
@@ -0,0 +1,161 @@
|
|||||||
|
import React, { useState } from "react"
|
||||||
|
import {
|
||||||
|
FaCommentDots,
|
||||||
|
FaUserFriends,
|
||||||
|
FaBriefcase,
|
||||||
|
FaFacebookF,
|
||||||
|
FaTwitter,
|
||||||
|
FaDribbble,
|
||||||
|
FaSun,
|
||||||
|
FaMoon,
|
||||||
|
FaMedal
|
||||||
|
} from "react-icons/fa"
|
||||||
|
|
||||||
|
const ProfileCard = () => {
|
||||||
|
const [darkMode, setDarkMode] = useState(false)
|
||||||
|
const activityLevel = 87
|
||||||
|
const isPremium = true
|
||||||
|
|
||||||
|
let activityColor = ""
|
||||||
|
let activityEmoji = ""
|
||||||
|
let blocksToColor = 1
|
||||||
|
let celebrationEmoji = ""
|
||||||
|
|
||||||
|
if (activityLevel <= 24) {
|
||||||
|
activityColor = "red-600"
|
||||||
|
activityEmoji = "😞"
|
||||||
|
blocksToColor = 1
|
||||||
|
} else if (activityLevel <= 49) {
|
||||||
|
activityColor = "orange-500"
|
||||||
|
activityEmoji = "😐"
|
||||||
|
blocksToColor = 2
|
||||||
|
} else if (activityLevel <= 74) {
|
||||||
|
activityColor = "yellow-400"
|
||||||
|
activityEmoji = "🙂"
|
||||||
|
blocksToColor = 3
|
||||||
|
} else {
|
||||||
|
activityColor = "emerald-500"
|
||||||
|
activityEmoji = "😄"
|
||||||
|
blocksToColor = 4
|
||||||
|
celebrationEmoji = "🎉"
|
||||||
|
}
|
||||||
|
|
||||||
|
const colorMap = {
|
||||||
|
"red-600": "#dc2626",
|
||||||
|
"orange-500": "#f97316",
|
||||||
|
"yellow-400": "#facc15",
|
||||||
|
"emerald-500": "#10b981"
|
||||||
|
}
|
||||||
|
|
||||||
|
const getBlockStyle = (index) => ({
|
||||||
|
backgroundColor: index < blocksToColor ? colorMap[activityColor] : (darkMode ? "#4b5563" : "#d1d5db")
|
||||||
|
})
|
||||||
|
|
||||||
|
const stats = [
|
||||||
|
{ label: "Játékok", value: 1256, icon: <FaCommentDots /> },
|
||||||
|
{ label: "Barátok", value: 8562, icon: <FaUserFriends /> },
|
||||||
|
{ label: "Győzelmek", value: 189, icon: <FaBriefcase /> },
|
||||||
|
{ label: "Badge-ek", value: 6, icon: <FaMedal /> }
|
||||||
|
]
|
||||||
|
|
||||||
|
const badges = ["🏆", "🔥", "🎯", "🧠", "💎", "🚀"]
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className={`${darkMode ? "bg-gray-900" : "bg-gray-100"} min-h-screen flex flex-col justify-center items-center px-4 py-12 transition-colors duration-500`}>
|
||||||
|
<div className={`relative max-w-sm w-full rounded-xl shadow-lg overflow-hidden border
|
||||||
|
${darkMode ? "bg-gray-800 border-gray-700" : "bg-white border-gray-200"}`}>
|
||||||
|
|
||||||
|
<button
|
||||||
|
onClick={() => setDarkMode(!darkMode)}
|
||||||
|
className={`absolute top-4 right-4 p-2 rounded-full focus:outline-none
|
||||||
|
${darkMode ? "bg-yellow-400 text-gray-900 hover:bg-yellow-300" : "bg-gray-800 text-yellow-400 hover:bg-gray-700"}`}
|
||||||
|
aria-label="Toggle dark mode"
|
||||||
|
>
|
||||||
|
{darkMode ? <FaSun size={24} /> : <FaMoon size={24} />}
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<div className="p-6 text-center space-y-6">
|
||||||
|
<img
|
||||||
|
src="https://i.pravatar.cc/150?img=12"
|
||||||
|
alt="Avatar"
|
||||||
|
className={`w-24 h-24 mx-auto rounded-full border-4 mb-4 ${darkMode ? "border-blue-700" : "border-blue-200"}`}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div className="space-y-2">
|
||||||
|
<h2 className={`text-xl font-semibold ${darkMode ? "text-gray-100" : "text-gray-800"}`}>
|
||||||
|
BÉKAAAAA
|
||||||
|
</h2>
|
||||||
|
<div>
|
||||||
|
<div className={`inline-block px-3 py-1 rounded-full text-xs font-semibold
|
||||||
|
${darkMode
|
||||||
|
? (isPremium ? "bg-green-600 text-white" : "bg-gray-600 text-gray-200")
|
||||||
|
: (isPremium ? "bg-green-200 text-green-800" : "bg-blue-200 text-blue-800")}`}>
|
||||||
|
{isPremium ? "Premium Account" : "Free Account"}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<p className={`text-sm ${darkMode ? "text-gray-400" : "text-gray-500"}`}>
|
||||||
|
Active | Male | 23.05.1992
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex justify-center items-center space-x-2">
|
||||||
|
<p className={`text-sm font-medium flex items-center space-x-1`} style={{ color: colorMap[activityColor] }}>
|
||||||
|
<span>Activity Level: {activityLevel}%</span>
|
||||||
|
<span className="text-xl">{activityEmoji}</span>
|
||||||
|
{celebrationEmoji && <span className="text-xl ml-1">{celebrationEmoji}</span>}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex justify-center space-x-1 mb-4">
|
||||||
|
{[0, 1, 2, 3].map(i => (
|
||||||
|
<div
|
||||||
|
key={i}
|
||||||
|
className="w-8 h-1 rounded-full"
|
||||||
|
style={getBlockStyle(i)}
|
||||||
|
/>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Badge szekció */}
|
||||||
|
<div className={`rounded-lg p-4 ${darkMode ? "bg-blue-900" : "bg-blue-200"}`}>
|
||||||
|
<h3 className={`text-sm font-bold mb-2 ${darkMode ? "text-white" : "text-blue-800"}`}>Badge-ek</h3>
|
||||||
|
<div className="flex justify-center flex-wrap gap-2">
|
||||||
|
{badges.map((badge, i) => (
|
||||||
|
<span key={i} className="text-xl">
|
||||||
|
{badge}
|
||||||
|
</span>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Statisztikák */}
|
||||||
|
<div className={`flex flex-wrap justify-around items-center rounded-lg py-6 mt-4 text-white ${darkMode ? "bg-blue-700" : "bg-blue-500"}`}>
|
||||||
|
{stats.map((s, i) => (
|
||||||
|
<div key={i} className="text-center px-2 w-1/2 sm:w-1/4 mb-4">
|
||||||
|
<div className="mb-1 flex justify-center">{s.icon}</div>
|
||||||
|
<p className="text-sm font-semibold">{s.value}</p>
|
||||||
|
<p className="text-xs">{s.label}</p>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p className={`text-xs mb-4 ${darkMode ? "text-gray-400" : "text-gray-500"}`}>
|
||||||
|
Gyere és játsz velünk!
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className={`flex justify-center gap-6 text-2xl ${darkMode ? "text-blue-400" : "text-blue-600"}`}>
|
||||||
|
<FaFacebookF className="cursor-pointer hover:text-blue-600" />
|
||||||
|
<FaTwitter className="cursor-pointer hover:text-sky-400 hover:text-sky-500" />
|
||||||
|
<FaDribbble className="cursor-pointer hover:text-pink-400" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ProfileCard
|
||||||
|
|
||||||
|
|
||||||
|
import UserProfile from "../../components/Userdetails/Userdetails.jsx"
|
||||||
|
|
||||||
@@ -0,0 +1,226 @@
|
|||||||
|
import React from "react"
|
||||||
|
import Navbar from "../../components/Navbar/Navbar.jsx"
|
||||||
|
import Footer from "../../components/Footer/Footer.jsx"
|
||||||
|
import Background from "../../assets/backgrounds/Background"
|
||||||
|
import {
|
||||||
|
FaBuilding,
|
||||||
|
FaEnvelope,
|
||||||
|
FaHandshake,
|
||||||
|
FaPalette,
|
||||||
|
FaTags,
|
||||||
|
FaUserCheck,
|
||||||
|
FaDollarSign,
|
||||||
|
FaChartLine,
|
||||||
|
FaVideo,
|
||||||
|
FaHandsHelping,
|
||||||
|
FaTrophy,
|
||||||
|
FaChartBar,
|
||||||
|
FaUsers,
|
||||||
|
FaHeadset,
|
||||||
|
} from "react-icons/fa"
|
||||||
|
|
||||||
|
const Card = ({ icon, label, description, targetId, className }) => {
|
||||||
|
const handleClick = () => {
|
||||||
|
const section = document.getElementById(targetId)
|
||||||
|
if (section) {
|
||||||
|
section.scrollIntoView({ behavior: "smooth" })
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
onClick={handleClick}
|
||||||
|
className={`cursor-pointer hover:scale-105 transition-all duration-300 border border-gray-400 shadow-lg rounded-2xl p-8 w-72 text-center animate-fadeInUp ${className}`}
|
||||||
|
>
|
||||||
|
<div className="text-5xl mb-4 flex justify-center">{icon}</div>
|
||||||
|
<h3 className="text-2xl font-bold mb-2">{label}</h3>
|
||||||
|
<p className="text-white/90 text-sm">{description}</p>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
const SectionContainer = ({ id, title, children }) => {
|
||||||
|
return (
|
||||||
|
<section
|
||||||
|
id={id}
|
||||||
|
className="mt-20 mb-28 px-4 md:px-0 opacity-100 animate-fadeInUp"
|
||||||
|
>
|
||||||
|
<div className="text-center mb-12">
|
||||||
|
<h2 className="text-4xl font-bold border-b-4 inline-block border-emerald-400 pb-2 text-white">
|
||||||
|
{title}
|
||||||
|
</h2>
|
||||||
|
</div>
|
||||||
|
{children}
|
||||||
|
</section>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
const CompanyHub = () => {
|
||||||
|
return (
|
||||||
|
<div className="relative min-h-screen text-white">
|
||||||
|
{/* Background fixed behind everything */}
|
||||||
|
<div className="fixed inset-0 -z-10">
|
||||||
|
<Background />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="relative z-10 flex flex-col min-h-screen">
|
||||||
|
<Navbar />
|
||||||
|
|
||||||
|
<main className="flex-grow relative px-4 py-8 md:px-12 md:py-16 overflow-y-auto scroll-smooth">
|
||||||
|
<div className="flex justify-center gap-6 mt-8 flex-wrap">
|
||||||
|
<Card
|
||||||
|
icon={<FaBuilding />}
|
||||||
|
label="Mit nyújtunk"
|
||||||
|
description="Játékosított tanulási platform cégeknek."
|
||||||
|
targetId="intro"
|
||||||
|
className="bg-gradient-to-br from-pink-500 via-purple-600 to-purple-800"
|
||||||
|
/>
|
||||||
|
<Card
|
||||||
|
icon={<FaEnvelope />}
|
||||||
|
label="Kapcsolat"
|
||||||
|
description="Lépj kapcsolatba velünk vagy kérj ajánlatot!"
|
||||||
|
targetId="contact"
|
||||||
|
className="bg-gradient-to-br from-blue-700 to-blue-500"
|
||||||
|
/>
|
||||||
|
<Card
|
||||||
|
icon={<FaHandshake />}
|
||||||
|
label="Csatlakozás"
|
||||||
|
description="Legyél partnerünk, és fejlődj velünk!"
|
||||||
|
targetId="join"
|
||||||
|
className="bg-gradient-to-br from-green-700 to-green-500"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Mit nyújtunk */}
|
||||||
|
<SectionContainer id="intro" title="Mit nyújtunk cégeknek">
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-10">
|
||||||
|
{/* Egyénre szabás */}
|
||||||
|
<div className="bg-white/5 rounded-3xl border border-gray-700 shadow-lg p-10 flex flex-col gap-8">
|
||||||
|
<h3 className="text-2xl font-extrabold flex items-center gap-4 text-emerald-400">
|
||||||
|
<FaPalette className="text-4xl" />
|
||||||
|
Egyénre szabás
|
||||||
|
</h3>
|
||||||
|
<ul className="list-disc ml-6 space-y-4 text-white/90 text-lg">
|
||||||
|
<li className="flex items-center gap-4">
|
||||||
|
<FaUserCheck className="text-green-400 text-2xl" />
|
||||||
|
Testreszabható design és színek
|
||||||
|
</li>
|
||||||
|
<li className="flex items-center gap-4">
|
||||||
|
<FaTrophy className="text-yellow-400 text-2xl" />
|
||||||
|
Egyedi badge és jutalmazási rendszer
|
||||||
|
</li>
|
||||||
|
<li className="flex items-center gap-4">
|
||||||
|
<FaChartBar className="text-blue-400 text-2xl" />
|
||||||
|
Fejlődési útvonalak
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Árazás */}
|
||||||
|
<div className="bg-white/5 rounded-3xl border border-gray-700 shadow-lg p-10 flex flex-col gap-8">
|
||||||
|
<h3 className="text-2xl font-extrabold flex items-center gap-4 text-emerald-400">
|
||||||
|
<FaDollarSign className="text-4xl" />
|
||||||
|
Árazás
|
||||||
|
</h3>
|
||||||
|
<ul className="list-disc ml-6 space-y-4 text-white/90 text-lg">
|
||||||
|
<li className="flex items-center gap-4">
|
||||||
|
<FaUsers className="text-purple-400 text-2xl" />
|
||||||
|
Kedvezményes csomagok KKV-knak
|
||||||
|
</li>
|
||||||
|
<li className="flex items-center gap-4">
|
||||||
|
<FaChartLine className="text-indigo-400 text-2xl" />
|
||||||
|
Testreszabott megoldások
|
||||||
|
</li>
|
||||||
|
<li className="flex items-center gap-4">
|
||||||
|
<FaTags className="text-pink-400 text-2xl" />
|
||||||
|
Nincs rejtett költség
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Demó videó */}
|
||||||
|
<div className="bg-white/5 rounded-3xl border border-gray-700 shadow-lg p-10 flex flex-col gap-8">
|
||||||
|
<h3 className="text-2xl font-extrabold flex items-center gap-4 text-emerald-400">
|
||||||
|
<FaVideo className="text-4xl" />
|
||||||
|
Csapatunk videó
|
||||||
|
</h3>
|
||||||
|
<video controls className="w-full rounded-xl shadow-xl">
|
||||||
|
<source src="/demo.mp4" type="video/mp4" />
|
||||||
|
A böngésződ nem támogatja a videó lejátszását.
|
||||||
|
</video>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</SectionContainer>
|
||||||
|
|
||||||
|
{/* Contact + Join Section */}
|
||||||
|
<section className="grid md:grid-cols-2 gap-10 max-w-6xl mx-auto mt-20 mb-28 px-4 md:px-0">
|
||||||
|
{/* Contact */}
|
||||||
|
<div
|
||||||
|
id="contact"
|
||||||
|
className="bg-white/10 p-8 rounded-xl border border-gray-500 shadow-lg"
|
||||||
|
>
|
||||||
|
<h2 className="text-3xl font-bold mb-6 text-center border-b-4 border-emerald-400 pb-2 text-white">
|
||||||
|
Kapcsolatfelvétel cégeknek
|
||||||
|
</h2>
|
||||||
|
<form className="grid gap-6 md:grid-cols-2">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder="Cég neve"
|
||||||
|
className="bg-white/20 text-white placeholder-white px-5 py-4 rounded-lg focus:outline-none focus:ring-2 focus:ring-emerald-400 col-span-2"
|
||||||
|
/>
|
||||||
|
<input
|
||||||
|
type="email"
|
||||||
|
placeholder="Email"
|
||||||
|
className="bg-white/20 text-white placeholder-white px-5 py-4 rounded-lg focus:outline-none focus:ring-2 focus:ring-emerald-400 col-span-2 md:col-span-1"
|
||||||
|
/>
|
||||||
|
<textarea
|
||||||
|
placeholder="Üzenet"
|
||||||
|
rows="6"
|
||||||
|
className="bg-white/20 text-white placeholder-white px-5 py-4 rounded-lg focus:outline-none focus:ring-2 focus:ring-emerald-400 col-span-2"
|
||||||
|
/>
|
||||||
|
<button
|
||||||
|
type="submit"
|
||||||
|
className="bg-emerald-500 hover:bg-emerald-400 text-white px-8 py-4 rounded-lg font-bold col-span-2 md:col-span-1 transition"
|
||||||
|
>
|
||||||
|
Küldés
|
||||||
|
</button>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Join */}
|
||||||
|
<div
|
||||||
|
id="join"
|
||||||
|
className="bg-white/10 p-8 rounded-xl border border-gray-500 shadow-lg"
|
||||||
|
>
|
||||||
|
<h2 className="text-3xl font-bold mb-6 text-center border-b-4 border-emerald-400 pb-2 text-white">
|
||||||
|
Csatlakozz partnerként
|
||||||
|
</h2>
|
||||||
|
<ul className="list-disc space-y-4 ml-8 text-base text-white/90">
|
||||||
|
<li className="flex gap-3 items-center">
|
||||||
|
<FaHandsHelping className="text-green-400 text-xl flex-shrink-0" />
|
||||||
|
Gamification a vállalati kultúrában
|
||||||
|
</li>
|
||||||
|
<li className="flex gap-3 items-center">
|
||||||
|
<FaChartBar className="text-blue-400 text-xl flex-shrink-0" />
|
||||||
|
Teljesítménymérés játékosan
|
||||||
|
</li>
|
||||||
|
<li className="flex gap-3 items-center">
|
||||||
|
<FaUserCheck className="text-yellow-400 text-xl flex-shrink-0" />
|
||||||
|
Személyre szabott riportok
|
||||||
|
</li>
|
||||||
|
<li className="flex gap-3 items-center">
|
||||||
|
<FaHeadset className="text-pink-400 text-xl flex-shrink-0" />
|
||||||
|
Dedikált ügyfélszolgálat
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<Footer />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default CompanyHub
|
||||||
@@ -5,6 +5,9 @@ import PopUp from "../../components/PopUp/PopUp"
|
|||||||
import Logo from "../../assets/pictures/Logo.jsx"
|
import Logo from "../../assets/pictures/Logo.jsx"
|
||||||
import Navbar from "../../components/Navbar/Navbar"
|
import Navbar from "../../components/Navbar/Navbar"
|
||||||
import Footer from "../../components/Footer/Footer.jsx"
|
import Footer from "../../components/Footer/Footer.jsx"
|
||||||
|
import UserProfile from "../../components/Userdetails/Userdetails.jsx"
|
||||||
|
import CompanyHub from "../Companies/Companies.jsx"
|
||||||
|
|
||||||
import RatingSet from "../../components/PopUp/RatingSet" // <- statisztikai komponens
|
import RatingSet from "../../components/PopUp/RatingSet" // <- statisztikai komponens
|
||||||
|
|
||||||
export default function Test() {
|
export default function Test() {
|
||||||
@@ -15,6 +18,9 @@ export default function Test() {
|
|||||||
return (
|
return (
|
||||||
<div className="w-full h-screen flex flex-col">
|
<div className="w-full h-screen flex flex-col">
|
||||||
<Navbar />
|
<Navbar />
|
||||||
|
<UserProfile />
|
||||||
|
<CompanyHub />
|
||||||
|
|
||||||
<div className="flex-1 flex flex-col items-center justify-center space-y-6">
|
<div className="flex-1 flex flex-col items-center justify-center space-y-6">
|
||||||
<InputBox
|
<InputBox
|
||||||
placeholder="E-mail cím"
|
placeholder="E-mail cím"
|
||||||
|
|||||||
Reference in New Issue
Block a user