Websites/interactives
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix Bulgarian Solitaire bugs

Browse source 
Update animation to fade to red and back. Debug reset functionality to ensure all states are cleared.
This commit is contained in:
gpt-engineer-app[bot] 2025-08-22 10:53:25 +00:00
parent 4eab9a899b
commit 748c12c3cf
1 changed files with 5 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/components/BulgarianSolitaire.tsx
View file

@ -440,10 +440,12 @@ const BulgarianSolitaire: React.FC<BulgarianSolitaireProps> = ({ showSocialShare
onDragStart={(e) => handleDragStart(e, boxId)} onDragStart={(e) => handleDragStart(e, boxId)}
onDoubleClick={() => handleDoubleClick(boxId)} onDoubleClick={() => handleDoubleClick(boxId)}
className={`w-8 h-8 rounded cursor-move transition-all duration-300 flex items-center justify-center text-xs font-medium mx-auto ${ className={`w-8 h-8 rounded cursor-move transition-all duration-300 flex items-center justify-center text-xs font-medium mx-auto ${
highlightedBoxes.has(boxId) isAnimating && highlightedBoxes.has(boxId)
? 'animate-[fade-red_1.6s_ease-in-out_infinite] shadow-lg scale-110 text-white'
: highlightedBoxes.has(boxId)
? 'bg-red-500 text-white shadow-lg scale-110' ? 'bg-red-500 text-white shadow-lg scale-110'
: 'bg-primary text-primary-foreground hover:bg-primary/80' : 'bg-primary text-primary-foreground hover:bg-primary/80'
} ${isAnimating && highlightedBoxes.has(boxId) ? 'animate-[fade-red_1.6s_ease-in-out_infinite]' : ''}`} }`}
title="Drag to move or double-click to move to last-used column" title="Drag to move or double-click to move to last-used column"
> >
</div> </div>
@ -485,7 +487,7 @@ const BulgarianSolitaire: React.FC<BulgarianSolitaireProps> = ({ showSocialShare
</button> </button>
{showInstructions && ( {showInstructions && (
<ul className="list-disc list-inside space-y-2 text-sm text-muted-foreground"> <ul className="list-disc list-inside space-y-2 text-sm text-muted-foreground">
<li>Choose a value for n (3-45) using the slider</li> <li>Choose a value for n (2-45) using the slider</li>
<li>Drag the {totalBoxes} boxes from the container into any of the columns</li> <li>Drag the {totalBoxes} boxes from the container into any of the columns</li>
<li>Drag boxes between columns to rearrange them as needed</li> <li>Drag boxes between columns to rearrange them as needed</li>
<li>Drag boxes back to the container or double-click any box in a column to move it to the last-used column</li> <li>Drag boxes back to the container or double-click any box in a column to move it to the last-used column</li>