fine-tuning kanban

Signed-off-by: Stephan Richter <s.richter@srsoftware.de>

frontend/src/routes/project/Kanban.svelte

@@ -5,6 +5,8 @@
     import { api } from '../../urls.svelte.js';
     import { t } from '../../translations.svelte.js';
 
+    import Card from './KanbanCard.svelte';
+
     let { id } = $props();
 
     let error = $state(null);
@@ -146,7 +148,7 @@
 <span class="error">{error}</span>
 {/if}
 
-<div class="grid" style="display: grid; grid-template-columns: {`repeat(${columns}, auto)`}">
+<div class="kanban" style="display: grid; grid-template-columns: {`repeat(${columns}, auto)`}">
     <div class="head">{t('user')}</div>
     {#if states}
     {#each Object.entries(states) as [sid,state]}
@@ -159,7 +161,7 @@
             <div class={[state, highlight.user == user && highlight.state == state ? 'highlight':'']} ondragover={ev => hover(ev,user,state)} ondrop={ev => drop(user,state)} >
             {#if stateList[state]}
             {#each Object.values(stateList[state]).sort((a,b) => a.name.localeCompare(b.name)) as task}
-                <div draggable="true" class="box" onclick={() => router.navigate(`/task/${task.id}/view`)} ondragstart={ev => dragged=task} >{task.name}</div>
+                <Card onclick={() => router.navigate(`/task/${task.id}/view`)} ondragstart={ev => dragged=task} {task} />
             {/each}
             {/if}
             </div>

frontend/src/routes/project/KanbanCard.svelte

@@ -0,0 +1,7 @@
+<script>
+    let { ondragstart, task } = $props();
+</script>
+
+<div draggable="true" class="box" {ondragstart} >
+{task.name}
+</div>