Donat/SerpentRace
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Deck törlés funkció implementálása modal-lal és consequence értékek finomítása

Browse Source
This commit is contained in:
GitG0r0
2025-10-30 18:25:25 +01:00
parent 46369ed112
commit bfcdd3ec9d
4 changed files with 102 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
SerpentRace_Frontend/src/components/DeckCreator/DeckHeader.jsx
+21 -9
View File
@@ -2,7 +2,7 @@
// Deck alapadatok szerkesztése és mentés
import React, { useState, useRef, useEffect } from "react"
import { FaSave, FaArrowLeft, FaGlobe, FaLock, FaQuestionCircle, FaDice, FaLaughBeam } from "react-icons/fa"
import { FaSave, FaArrowLeft, FaGlobe, FaLock, FaQuestionCircle, FaDice, FaLaughBeam, FaTrash } from "react-icons/fa"
const deckTypes = [
{ value: "QUESTION", label: "Kérdés", icon: FaQuestionCircle, color: "var(--color-question)" },
@@ -15,7 +15,7 @@ const privacyOptions = [
{ value: "public", label: "Publikus", icon: FaGlobe }
]
export default function DeckHeader({ deck, onUpdate, onSave, onBack }) {
export default function DeckHeader({ deck, onUpdate, onSave, onBack, onDelete }) {
const [isTypeDropdownOpen, setIsTypeDropdownOpen] = useState(false);
const [isPrivacyDropdownOpen, setIsPrivacyDropdownOpen] = useState(false);
const typeDropdownRef = useRef(null);
@@ -64,13 +64,25 @@ export default function DeckHeader({ deck, onUpdate, onSave, onBack }) {
</h1>
</div>
<button
onClick={onSave}
className="flex items-center gap-2 px-6 py-2 rounded-xl bg-[color:var(--color-success)] hover:bg-[color:var(--color-success)]/80 text-[color:var(--color-text-inverse)] font-semibold transition-all duration-200 hover:scale-105 shadow-lg"
>
<FaSave />
Mentés
</button>
<div className="flex items-center gap-3">
{deck.id && (
<button
onClick={onDelete}
className="flex items-center gap-2 px-6 py-2 rounded-xl bg-red-600 hover:bg-red-700 text-white font-semibold transition-all duration-200 hover:scale-105 shadow-lg"
>
<FaTrash />
Törlés
</button>
)}
<button
onClick={onSave}
className="flex items-center gap-2 px-6 py-2 rounded-xl bg-[color:var(--color-success)] hover:bg-[color:var(--color-success)]/80 text-[color:var(--color-text-inverse)] font-semibold transition-all duration-200 hover:scale-105 shadow-lg"
>
<FaSave />
Mentés
</button>
</div>
</div>
{/* Main Content Row */}
SerpentRace_Frontend/src/components/DeckCreator/LuckCardEditor.jsx
+7 -4
View File
@@ -150,20 +150,23 @@ export default function LuckCardEditor({ card, onChange }) {
</div>
</div>
{/* Consequence Value - csak ha előre/hátra lépés */}
{(cardData.consequence?.type === 0 || cardData.consequence?.type === 1) && (
{/* Consequence Value - csak kör kihagyás és extra kör */}
{(cardData.consequence?.type === 2 || cardData.consequence?.type === 3) && (
<div>
<label className="block text-[color:var(--color-text-muted)] text-sm font-medium mb-2">
Mezők száma
{cardData.consequence?.type === 2 ? 'Körök kihagyása' : 'Extra körök száma'}
</label>
<input
type="number"
min="1"
max="10"
max="5"
value={cardData.consequence?.value ?? 1}
onChange={(e) => updateConsequence('value', parseInt(e.target.value) || 1)}
className="w-full px-4 py-2 rounded-xl bg-[color:var(--color-background)] border border-[color:var(--color-surface-selected)] text-[color:var(--color-text)] focus:ring-2 focus:ring-[color:var(--color-luck)] focus:border-transparent outline-none transition-all duration-200"
/>
<div className="text-xs text-[color:var(--color-text-muted)] mt-1">
Érték: 1-5 között
</div>
</div>
)}
</div>