gavin/Tarokka
1
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

better looking transparency

Browse Source
This commit is contained in:
Gavin McDonald
2025-06-12 10:44:54 -04:00
parent d572bdcd0e
commit a3b2efac97
2 changed files with 24 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
components/Card.tsx
View File

@@ -52,11 +52,20 @@ export default function Card({ dm, card, position, settings, flipAction }: CardP
className={`absolute inset-0 transition-transform duration-500 transform-style-preserve-3d ${flipped ? 'rotate-y-180' : ''}`}
>
<div className="absolute inset-0 group backface-hidden">
{dm && <img src={getURL(card, settings)} alt={aria} className="absolute rounded-lg" />}
{dm && (
<>
<img src={getURL(card, settings)} alt={aria} className="absolute rounded-lg" />
<img
src={getURL(cardBack as TarokkaGameCard, settings)}
alt=""
className={`absolute rounded-lg see-through`}
/>
</>
)}
<img
src={getURL(cardBack as TarokkaGameCard, settings)}
alt="Card Back"
className={`absolute rounded-lg ${dm ? 'transition duration-500 group-hover:opacity-30' : ''} ${settings.cardStyle === 'grayscale' ? 'border border-yellow-500/25 group-hover:drop-shadow-[0_0_3px_#ffd700/50]' : ''}`}
className={`absolute rounded-lg ${dm ? 'transition duration-500 group-hover:opacity-0' : ''} ${settings.cardStyle === 'grayscale' ? 'border border-yellow-500/25 group-hover:drop-shadow-[0_0_3px_#ffd700/50]' : ''}`}
/>
{dm && !flipped && (
<StackTheDeck onRedo={() => console.log('Redo')} onPick={() => console.log('Pick')} />