1 Commits

Author SHA1 Message Date
Walke d23328763b footer fix meg landingon 2025-10-15 15:24:06 +02:00
7 changed files with 52 additions and 77 deletions
-7
View File
@@ -32,10 +32,3 @@ MINIO_USE_SSL=false
MAX_SPECIAL_FIELDS_PERCENTAGE=67 MAX_SPECIAL_FIELDS_PERCENTAGE=67
MAX_GENERATION_TIME_SECONDS=20 MAX_GENERATION_TIME_SECONDS=20
GENERATION_ERROR_TOLERANCE=15 GENERATION_ERROR_TOLERANCE=15
# EMAIL SERVICE CONFIGURATION
EMAIL_HOST=smtp.gmail.com
EMAIL_PORT=587
EMAIL_USER=your_email@domain.com
EMAIL_PASS=your_email_password
EMAIL_FROM=noreply@serpentrace.com
-10
View File
@@ -73,13 +73,3 @@ export const verifyEmail = async (token) => {
throw error throw error
} }
} }
// Get current user's game statistics
export const getUserStats = async () => {
try {
const response = await apiClient.get("/users/me/stats")
return response.data
} catch (error) {
throw error
}
}
@@ -1,43 +1,17 @@
import React, { useEffect, useRef, useState } from "react" import React from "react"
import { Link } from "react-router-dom" import { Link } from "react-router-dom"
import Logo from "../../assets/pictures/Logo" import Logo from "../../assets/pictures/Logo"
const ArrowUpIcon = () => <span style={{ fontSize: "1.25rem" }}></span> const ArrowUpIcon = () => <span style={{ fontSize: "1.25rem" }}></span>
const Footer = () => { const Footer = () => {
const [isVisible, setIsVisible] = useState(false)
const footerRef = useRef(null)
useEffect(() => {
const observer = new IntersectionObserver(
([entry]) => {
setIsVisible(entry.isIntersecting)
},
{ threshold: 0.3 }
)
if (footerRef.current) {
observer.observe(footerRef.current)
}
return () => {
if (footerRef.current) {
observer.unobserve(footerRef.current)
}
}
}, [])
const scrollToTop = () => { const scrollToTop = () => {
window.scrollTo({ top: 0, behavior: "smooth" }) window.scrollTo({ top: 0, behavior: "smooth" })
} }
return ( return (
<footer <footer
ref={footerRef} className="relative bg-zinc-900 text-white border-t-2 border-zinc-800 mt-auto py-8"
className={`relative bg-zinc-900 text-white border-t-2 border-zinc-800 mt-auto py-8 transition-all duration-700 ease-out ${
isVisible ? "opacity-100 scale-100 translate-y-0" : "opacity-0 scale-95 translate-y-10"
}`}
style={{ transformOrigin: "bottom center" }} style={{ transformOrigin: "bottom center" }}
> >
<style> <style>
@@ -51,10 +25,7 @@ const Footer = () => {
<div className="max-w-6xl mx-auto flex flex-wrap justify-between items-start gap-8 px-4"> <div className="max-w-6xl mx-auto flex flex-wrap justify-between items-start gap-8 px-4">
{/* Logó */} {/* Logó */}
<div className="flex flex-col items-center footer-animate"> <div className="flex flex-col items-center footer-animate">
<a <a href="/" className="transition-transform duration-500 hover:scale-105 hover:brightness-125">
href="/"
className="transition-transform duration-500 hover:scale-105 hover:brightness-125"
>
<Logo size={100} /> <Logo size={100} />
</a> </a>
<span className="font-extrabold text-xl mt-2 tracking-wide">SerpentRace</span> <span className="font-extrabold text-xl mt-2 tracking-wide">SerpentRace</span>
@@ -65,11 +36,15 @@ const Footer = () => {
<span className="text-lg font-semibold text-green-400 underline underline-offset-4 mb-2 drop-shadow-sm"> <span className="text-lg font-semibold text-green-400 underline underline-offset-4 mb-2 drop-shadow-sm">
Oldalak Oldalak
</span> </span>
<a href="/" className="hover:underline hover:text-green-400 transition">Főoldal</a> <a href="/" className="hover:underline hover:text-green-400 transition">
Főoldal
</a>
<a href="/about" className="hover:underline hover:text-green-400 transition"> <a href="/about" className="hover:underline hover:text-green-400 transition">
Rólunk Rólunk
</a> </a>
<a href="/contact" className="hover:underline hover:text-green-400 transition">Kapcsolat</a> <a href="/contact" className="hover:underline hover:text-green-400 transition">
Kapcsolat
</a>
</div> </div>
{/* Közösség */} {/* Közösség */}
@@ -77,8 +52,22 @@ const Footer = () => {
<span className="text-lg font-semibold text-green-400 underline underline-offset-4 mb-2 drop-shadow-sm"> <span className="text-lg font-semibold text-green-400 underline underline-offset-4 mb-2 drop-shadow-sm">
Közösség Közösség
</span> </span>
<a href="https://discord.gg/" target="_blank" rel="noopener noreferrer" className="hover:underline hover:text-green-400 transition">Discord</a> <a
<a href="https://github.com/" target="_blank" rel="noopener noreferrer" className="hover:underline hover:text-green-400 transition">GitHub</a> href="https://discord.gg/"
target="_blank"
rel="noopener noreferrer"
className="hover:underline hover:text-green-400 transition"
>
Discord
</a>
<a
href="https://github.com/"
target="_blank"
rel="noopener noreferrer"
className="hover:underline hover:text-green-400 transition"
>
GitHub
</a>
</div> </div>
{/* Elérhetőség */} {/* Elérhetőség */}
@@ -96,15 +85,13 @@ const Footer = () => {
</div> </div>
{/* Scroll to top */} {/* Scroll to top */}
{isVisible && ( <button
<button onClick={scrollToTop}
onClick={scrollToTop} className="fixed bottom-6 right-6 bg-green-500 hover:bg-green-600 text-white p-3 rounded-full shadow-lg transition transform hover:scale-110"
className="fixed bottom-6 right-6 bg-green-500 hover:bg-green-600 text-white p-3 rounded-full shadow-lg transition transform hover:scale-110" aria-label="Ugrás az oldal tetejére"
aria-label="Ugrás az oldal tetejére" >
> <ArrowUpIcon />
<ArrowUpIcon /> </button>
</button>
)}
</footer> </footer>
) )
} }
@@ -6,7 +6,13 @@ import ButtonGreen from "../Buttons/ButtonGreen.jsx"
import { FaUsers, FaPaintBrush, FaHeadset } from "react-icons/fa" import { FaUsers, FaPaintBrush, FaHeadset } from "react-icons/fa"
import { motion } from "framer-motion" import { motion } from "framer-motion"
const LandingPage = ({ onNavigateToPlay, onNavigateToAuth }) => { import { useNavigate } from "react-router-dom"
const LandingPage = ({ onNavigateToPlay }) => {
const navigate = useNavigate()
const handleNavigateToAuth = () => {
navigate("/register")
}
return ( return (
<div className="w-full"> <div className="w-full">
{/* Hero Section */} {/* Hero Section */}
@@ -55,8 +61,8 @@ const LandingPage = ({ onNavigateToPlay, onNavigateToAuth }) => {
animate={{ opacity: 1, y: 0 }} animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.7, delay: 1 }} transition={{ duration: 0.7, delay: 1 }}
> >
<ButtonGreen text="Bejelntekezés" onClick={onNavigateToPlay} width="w-60" /> <ButtonGreen text="Játék" onClick={onNavigateToPlay} width="w-60" />
<ButtonGreen text="Regisztráció" onClick={onNavigateToAuth} width="w-60" /> <ButtonGreen text="Regisztráció" onClick={handleNavigateToAuth} width="w-60" />
</motion.div> </motion.div>
</div> </div>
</motion.section> </motion.section>
@@ -165,7 +171,7 @@ const LandingPage = ({ onNavigateToPlay, onNavigateToAuth }) => {
<ButtonGreen <ButtonGreen
text="Kapcsolatfelvétel" text="Kapcsolatfelvétel"
onClick={onNavigateToAuth} onClick={handleNavigateToAuth}
className="px-12 py-4 text-xl font-bold" className="px-12 py-4 text-xl font-bold"
/> />
</motion.div> </motion.div>
+1 -1
View File
@@ -25,7 +25,7 @@ export default function Home() {
<div className="fixed top-0 left-0 right-0 z-30"> <div className="fixed top-0 left-0 right-0 z-30">
<Navbar /> <Navbar />
</div> </div>
<main className="flex-1 flex flex-col items-center justify-start py-15 min-h-0 mt-[64px]"> <main className="flex-1 flex flex-col items-center justify-start py-15 min-h-0 mt-[640px]">
<PlayMenu onJoinGame={handleJoinGame} onCreateGame={handleCreateGame} user={user} /> <PlayMenu onJoinGame={handleJoinGame} onCreateGame={handleCreateGame} user={user} />
{/* Ide jöhetnek további szekciók, ha szeretnél még tartalmat */} {/* Ide jöhetnek további szekciók, ha szeretnél még tartalmat */}
</main> </main>
@@ -1,23 +1,23 @@
// src/pages/Landing/Landingpage.jsx // src/pages/Landing/Landingpage.jsx
// Főoldal - Landing Page // Főoldal - Landing Page
import { useState } from "react"
import { useNavigate } from "react-router-dom"
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 Background from "../../assets/backgrounds/Background.jsx" import Background from "../../assets/backgrounds/Background.jsx"
import LandingPage from "../../components/Landingpage/LandingPage.jsx" import LandingPage from "../../components/Landingpage/LandingPage.jsx"
export default function LandingPageMain() { export default function LandingPageMain() {
const navigate = useNavigate(); // Navigációs callbackok
const handleNavigateToPlay = () => { const handleNavigateToPlay = () => {
navigate("/login"); // Itt lehet navigálni a játék oldalra
}; alert("Navigáció a játék oldalra")
}
const handleNavigateToAuth = () => { const handleNavigateToAuth = () => {
navigate("/register"); // Itt lehet navigálni a bejelentkezés oldalra
}; alert("Navigáció a bejelentkezés oldalra")
}
return ( return (
<div className="w-full min-h-screen flex flex-col relative overflow-x-hidden"> <div className="w-full min-h-screen flex flex-col relative overflow-x-hidden">
@@ -32,5 +32,5 @@ export default function LandingPageMain() {
</main> </main>
<Footer /> <Footer />
</div> </div>
); )
} }
@@ -3,7 +3,6 @@ import { useState } from "react"
import Navbar from "../../components/Navbar/Navbar.jsx" import Navbar from "../../components/Navbar/Navbar.jsx"
import Footer from "../../components/Footer/Footer.jsx" import Footer from "../../components/Footer/Footer.jsx"
import Background from "../../assets/backgrounds/Background.jsx" import Background from "../../assets/backgrounds/Background.jsx"
import { getUserStats } from "../../api/userApi.js"
export default function Reports() { export default function Reports() {
return ( return (