change project layout

1 files changed, 33 insertions, 0 deletions

diff --git a/src/components/card_thumb.svelte b/src/components/card_thumb.svelte
new file mode 100644
index 0000000..8e701ea
--- /dev/null
+++ b/src/components/card_thumb.svelte
@@ -0,0 +1,33 @@
+<script lang="js">
+
+    import { setLeftPanelCard } from '../left_panel';
+    import { cardImageUrl } from '../utils';
+
+    let {id, area, idx} = $props();
+
+    function onhover() {
+        setLeftPanelCard(id); 
+    }
+
+    function onDragStart(e) {
+        e.dataTransfer.setData('text', JSON.stringify({id, area, idx}))
+    }
+
+</script>
+
+{#if id}
+    <img
+        style="margin:2px;"
+        draggable="true"
+        onmouseover={onhover}
+        onfocus={onhover}
+        ondragstart={onDragStart}
+        height="100%"
+        src={cardImageUrl(id)}
+        alt="yugioh card {id}"
+    />
+{/if}
+
+<style>
+
+</style>