eric/wizwar6e
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

The selected-card preview zooms to the full reading modal on a click

Browse Source 
Selecting a hand card must not throw a modal over the board — the aim
comes next — so the corner preview becomes the doorway: click it and
the card opens at tile-peek size, close it and the selection stands.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_015RCWSTnb1KYTPyL4GmhGnF
This commit is contained in:
Eric Wagoner
2026-08-30 15:55:21 -04:00
co-authored by Claude Fable 5
parent 51aae53ae2
commit beaae4a0a4
1 changed files with 8 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/web/src/App.svelte
+8 -3
View File
@@ -2630,11 +2630,12 @@
</div> </div>
{#if selectedCard && !inspectorHidden} {#if selectedCard && !inspectorHidden}
<div class="inspector" role="img" aria-label="selected card, enlarged"> <div class="inspector">
<button class="inspector-close" onclick={() => (inspectorHidden = true)} aria-label="hide enlarged card">×</button> <button class="inspector-close" onclick={() => (inspectorHidden = true)} aria-label="hide enlarged card">×</button>
<div class="inspector-card"> <button class="inspector-card" title="read it full size"
onclick={() => (peekCard = selectedCard)}>
<Card card={selectedCard} onfaq={(id) => (faqCardId = id)} /> <Card card={selectedCard} onfaq={(id) => (faqCardId = id)} />
</div> </button>
</div> </div>
{/if} {/if}
@@ -3735,6 +3736,10 @@
transform: scale(1.55); transform: scale(1.55);
transform-origin: bottom right; transform-origin: bottom right;
filter: drop-shadow(0 10px 26px rgba(0, 0, 0, 0.65)); filter: drop-shadow(0 10px 26px rgba(0, 0, 0, 0.65));
background: none;
border: none;
padding: 0;
cursor: zoom-in;
} }
.inspector-card :global(.card) { .inspector-card :global(.card) {
cursor: default; cursor: default;