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

Fix Zeckendorf Search Trick: bottom-align button containers within cards

Browse source
This commit is contained in:
Neeldhara Misra 2025-07-22 11:23:06 +05:30
parent fae5d36084
commit a7a026f87c
1 changed files with 4 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/components/ZeckendorfSearchTrick.tsx
View file

@ -310,7 +310,7 @@ const ZeckendorfSearchTrick = ({ showSocialShare = true }: ZeckendorfSearchTrick
<CardHeader className="pb-2"> <CardHeader className="pb-2">
<CardTitle className="text-xl text-center">{card.title}</CardTitle> <CardTitle className="text-xl text-center">{card.title}</CardTitle>
</CardHeader> </CardHeader>
<CardContent className="pt-0"> <CardContent className="pt-0 flex flex-col h-full">
<div className="grid grid-cols-4 gap-1 text-xs"> <div className="grid grid-cols-4 gap-1 text-xs">
{card.numbers.map(num => ( {card.numbers.map(num => (
<div <div
@ -326,12 +326,12 @@ const ZeckendorfSearchTrick = ({ showSocialShare = true }: ZeckendorfSearchTrick
))} ))}
</div> </div>
<div className="flex gap-2 mt-4"> <div className="flex gap-2 mt-4 mt-auto">
<Button <Button
onClick={() => handleCardSelection(card.id, 'present')} onClick={() => handleCardSelection(card.id, 'present')}
variant={cardStates[card.id] === 'present' ? 'default' : 'outline'} variant={cardStates[card.id] === 'present' ? 'default' : 'outline'}
size="sm" size="sm"
className="flex-1 aspect-square flex items-end justify-center" className="flex-1 aspect-square flex items-center justify-center"
> >
✅ ✅
</Button> </Button>
@ -339,7 +339,7 @@ const ZeckendorfSearchTrick = ({ showSocialShare = true }: ZeckendorfSearchTrick
onClick={() => handleCardSelection(card.id, 'absent')} onClick={() => handleCardSelection(card.id, 'absent')}
variant={cardStates[card.id] === 'absent' ? 'default' : 'outline'} variant={cardStates[card.id] === 'absent' ? 'default' : 'outline'}
size="sm" size="sm"
className="flex-1 aspect-square flex items-end justify-center" className="flex-1 aspect-square flex items-center justify-center"
> >
❌ ❌
</Button> </Button>