diff --git a/SerpentRace_Frontend/src/assets/SerpentRace_Animation/SerpentRace_Animation.jsx b/SerpentRace_Frontend/src/assets/SerpentRace_Animation/SerpentRace_Animation.jsx index 1c1ade42..376466b0 100644 --- a/SerpentRace_Frontend/src/assets/SerpentRace_Animation/SerpentRace_Animation.jsx +++ b/SerpentRace_Frontend/src/assets/SerpentRace_Animation/SerpentRace_Animation.jsx @@ -12,9 +12,9 @@ const Animation = ({ sizePercentage = 100 }) => { const pathRefs = Array.from({ length: 11 }, () => useRef(null)); return ( -
+
{/* prettier-ignore */} - + diff --git a/SerpentRace_Frontend/src/components/Footer/Footer.jsx b/SerpentRace_Frontend/src/components/Footer/Footer.jsx index 3a742156..33f63dea 100644 --- a/SerpentRace_Frontend/src/components/Footer/Footer.jsx +++ b/SerpentRace_Frontend/src/components/Footer/Footer.jsx @@ -33,75 +33,150 @@ const Footer = () => { return (
-
- {/* Logó */} -
- - +
+ {/* Mobile: Logo középen, majd grid alatta */} +
+
+ + +
- {/* Oldalak */} -
- - Oldalak - - - + {/* Mobile: 2 oszlopos grid */} +
+ {/* Oldalak */} +
+ + Oldalak + + + +
+ + {/* Közösség */} +
+ + Közösség + + + Discord + + + GitHub + +
- {/* Közösség */} -
- - Közösség - - - Discord - - - GitHub - -
- - {/* Elérhetőség */} -
- + {/* Mobile: Elérhetőség teljes széles */} +
+ Elérhetőség - Email: info@serpentrace.hu - Telefon: +36 30 123 4567 + Email: info@serpentrace.hu + Telefon: +36 30 123 4567 +
+ + {/* Desktop: Original flex layout */} +
+ {/* Logó */} +
+ + +
+ + {/* Oldalak */} +
+ + Oldalak + + + +
+ + {/* Közösség */} +
+ + Közösség + + + Discord + + + GitHub + +
+ + {/* Elérhetőség */} +
+ + Elérhetőség + + Email: info@serpentrace.hu + Telefon: +36 30 123 4567 +
diff --git a/SerpentRace_Frontend/src/components/Landingpage/LandingPage.jsx b/SerpentRace_Frontend/src/components/Landingpage/LandingPage.jsx index 5124ed65..b9e61502 100644 --- a/SerpentRace_Frontend/src/components/Landingpage/LandingPage.jsx +++ b/SerpentRace_Frontend/src/components/Landingpage/LandingPage.jsx @@ -18,19 +18,21 @@ const LandingPage = () => {
{/* Hero Section */} -
+
{/* Animált logo és cím */} -
- +
+
+ +
{ { { { {/* If not authenticated show Login/Register; if authenticated show Home button */} {!auth ? ( <> - - - + + + ) : ( - + )}
@@ -79,7 +81,7 @@ const LandingPage = () => { {/* Features Section */} { >
{ Miért a SerpentRace a legjobb választás? -
+
{/* Feature 1 */} -
- +
+
-

Közösségi élmény

+

Közösségi élmény

Ismerkedj, nevess, tanulj! A SerpentRace összehozza a társaságot, legyen szó baráti összejövetelről vagy csapatépítésről. @@ -117,16 +119,16 @@ const LandingPage = () => { {/* Feature 2 */} -

- +
+
-

Személyre szabható

+

Személyre szabható

Kérdéskártyák, szabályok, design – minden a te igényeidhez igazítható, akár céges brandinggel is! @@ -135,16 +137,16 @@ const LandingPage = () => { {/* Feature 3 */} -

- +
+
-

Folyamatos támogatás

+

Folyamatos támogatás

Gyors, segítőkész ügyfélszolgálat – ha bármilyen kérdésed vagy problémád van, mindig számíthatsz ránk! @@ -156,7 +158,7 @@ const LandingPage = () => { {/* Call to Action Section */} { >

-

+

Próbáld ki te is a SerpentRace-t!

-

+

Legyél részese egy új közösségi élménynek, vagy rendeld meg saját, személyre szabott társasjátékodat – mi mindenben segítünk!

@@ -182,7 +184,8 @@ const LandingPage = () => {
diff --git a/SerpentRace_Frontend/src/components/Landingpage/PlayMenu.jsx b/SerpentRace_Frontend/src/components/Landingpage/PlayMenu.jsx index 4a26513e..4e6991bb 100644 --- a/SerpentRace_Frontend/src/components/Landingpage/PlayMenu.jsx +++ b/SerpentRace_Frontend/src/components/Landingpage/PlayMenu.jsx @@ -55,43 +55,45 @@ const PlayMenu = ({ onJoinGame, onCreateGame, user, setUser }) => { return (
{/* Bal oldali animáció/kép */} -
- +
+
+ +
{/* Jobb oldali panel */} -
+
{username ? ( -
+
{initials}
-
+
{username} @@ -99,7 +101,7 @@ const PlayMenu = ({ onJoinGame, onCreateGame, user, setUser }) => {
) : (
-
Nincs bejelentkezve — játssz vendégként:
+
Nincs bejelentkezve — játssz vendégként:
{
-

Csatlakozás játékhoz

+

Csatlakozás játékhoz

{ />
{error &&
{error}
} -
+
{username ? ( -
+
{username && (
-

Új játék létrehozása

+

Új játék létrehozása

)} diff --git a/SerpentRace_Frontend/src/components/Navbar/Navbar.jsx b/SerpentRace_Frontend/src/components/Navbar/Navbar.jsx index a1af7983..3ca01408 100644 --- a/SerpentRace_Frontend/src/components/Navbar/Navbar.jsx +++ b/SerpentRace_Frontend/src/components/Navbar/Navbar.jsx @@ -233,18 +233,17 @@ const Navbar = () => {
) : ( -
- -
+ )}
)} diff --git a/SerpentRace_Frontend/src/pages/Decks/Card_display.jsx b/SerpentRace_Frontend/src/pages/Decks/Card_display.jsx index 175aed1d..49451377 100644 --- a/SerpentRace_Frontend/src/pages/Decks/Card_display.jsx +++ b/SerpentRace_Frontend/src/pages/Decks/Card_display.jsx @@ -145,6 +145,8 @@ const Card_display = () => { "QUESTION": "Kérdés", "LUCK": "Szerencse", "JOKER": "Joker", + "joker": "Joker", + "luck": "Szerencse", // If backend converts to different numbers, map them: "0": "Igaz/Hamis", // truefalse = 0 "1": "Feleletválasztós", // multiplechoice = 1 @@ -352,7 +354,7 @@ const Card_display = () => { )} {paginatedCards.map((card, idx) => { const cardIndex = startIndex + idx + 1 - const questionText = card.question || card.statement || 'Kérdés hiányzik' + const questionText = card.text || card.question || card.statement || 'Kérdés hiányzik' // Get answers based on card type let answerOptions = [] @@ -364,13 +366,30 @@ const Card_display = () => { // Detect card type by fields if subType is missing let detectedType = subType if (subType === 'undefined' || subType === 'null') { - // Check by numeric type field first - if (card.type === 3) { - // type 3 = True/False - detectedType = 'truefalse' - } else if (card.type === 2) { - // type 2 = Text answer - detectedType = 'text' + // First check deck type - if deck is JOKER or LUCK type, cards inherit that + if (deck.type === 1) { + // Deck type 1 = Joker deck + detectedType = 'joker' + } else if (deck.type === 0) { + // Deck type 0 = Luck deck + detectedType = 'luck' + } else if (card.type !== undefined) { + // Check by card.type field (string or numeric) + const cardType = typeof card.type === 'string' ? card.type.toLowerCase() : card.type + + if (cardType === 'joker' || card.type === 'JOKER') { + // Joker card + detectedType = 'joker' + } else if (cardType === 'luck' || card.type === 'LUCK') { + // Luck card + detectedType = 'luck' + } else if (card.type === 3) { + // type 3 = True/False + detectedType = 'truefalse' + } else if (card.type === 2) { + // type 2 = Text answer + detectedType = 'text' + } } else if (card.leftItems && card.rightItems && card.correctPairs) { // Has leftItems, rightItems AND correctPairs = matching detectedType = 'matching' @@ -385,6 +404,28 @@ const Card_display = () => { } } + // Extract consequence info for JOKER and LUCK cards + let consequenceText = null + if ((detectedType === 'joker' || detectedType === 'luck') && card.consequence) { + const consequenceLabels = { + 0: 'Lépj előre', + 1: 'Lépj hátra', + 2: 'Kör kihagyás', + 3: 'Extra kör', + 5: 'Vissza a starthoz' + } + const consequenceType = consequenceLabels[card.consequence.type] || 'Ismeretlen hatás' + const consequenceValue = card.consequence.value + + if (consequenceValue && [0, 1].includes(card.consequence.type)) { + consequenceText = `${consequenceType} ${consequenceValue} mezőt` + } else if (consequenceValue && [2, 3].includes(card.consequence.type)) { + consequenceText = `${consequenceType} (${consequenceValue} kör)` + } else { + consequenceText = consequenceType + } + } + if (detectedType === 'truefalse' || detectedType === '0') { // True/False cards answerOptions = ['Igaz', 'Hamis'] @@ -432,16 +473,92 @@ const Card_display = () => { return (
toggleCardFlip(cardId)} > + {detectedType === 'joker' ? ( + // Joker card - no flip, just show the task +
+
+ + Kártya #{cardIndex} + + + 🃏 JOKER + +
+ +
+
🃏
+
+ {questionText} +
+
+ +
+
Típus: Joker
+
+
+ ) : detectedType === 'luck' ? ( + // Luck card - no flip, show text and consequence +
+
+ + Kártya #{cardIndex} + + + 🎲 SZERENCSE + +
+ +
+
🎲
+
+ {questionText} +
+ {consequenceText && ( +
+
+ {consequenceText} +
+
+ )} +
+ +
+
Típus: Szerencse
+
+
+ ) : (
toggleCardFlip(cardId) : undefined} > {/* Front side - Question */}
{ Kártya #{cardIndex} - - {answerCount} válasz - + {detectedType !== 'joker' && detectedType !== 'luck' && ( + + {answerCount} válasz + + )} + {detectedType === 'joker' && ( + + 🃏 JOKER + + )} + {detectedType === 'luck' && ( + + 🎲 SZERENCSE + + )}

@@ -492,7 +633,7 @@ const Card_display = () => { >
- Megoldás + {detectedType === 'joker' || detectedType === 'luck' ? 'Kártya hatás' : 'Megoldás'} { color: "var(--color-text-inverse)", }} > - {answerCount} válasz + {detectedType === 'joker' || detectedType === 'luck' ? (detectedType === 'joker' ? '🃏 JOKER' : '🎲 SZERENCSE') : `${answerCount} válasz`}
- {answerCount > 0 ? ( + {detectedType === 'joker' ? ( + // Joker card - just show the task/challenge +
+
🃏
+
+ {questionText} +
+
+ A játékmester dönti el a teljesítést +
+
+ ) : detectedType === 'luck' ? ( + // Luck card - show consequence +
+
🎲
+ {consequenceText && ( +
+
+ {consequenceText} +
+
+ )} +
+ Azonnal végrehajt +
+
+ ) : answerCount > 0 ? (
Helyes válasz: @@ -563,6 +730,7 @@ const Card_display = () => {

+ )}
) })} diff --git a/SerpentRace_Frontend/src/pages/Landing/Home.jsx b/SerpentRace_Frontend/src/pages/Landing/Home.jsx index b0da054a..6ea674dc 100644 --- a/SerpentRace_Frontend/src/pages/Landing/Home.jsx +++ b/SerpentRace_Frontend/src/pages/Landing/Home.jsx @@ -82,7 +82,7 @@ export default function Home() {
-
+