From 7c5483ea5e24ec11266cafc58753863c81c3f246 Mon Sep 17 00:00:00 2001
From: Frederic Cabassut <cabassut.frederic@gmail.com>
Date: Sat, 7 Mar 2026 22:44:31 +0100
Subject: [PATCH] =?UTF-8?q?fix:=20checklist=20UX=20polish=20=E2=80=94=20sp?=
 =?UTF-8?q?acing,=20disable=20markdown=20toggle,=20default=20to=20raw=20mo?=
 =?UTF-8?q?de?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Increase gap between checkbox and text input (gap-1 → gap-2)
- Disable markdown toggle button in checklist mode
- Default to raw markdown mode when opening checklist notes as text

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/lib/components/Checklist.svelte  | 2 +-
 src/lib/components/NoteEditor.svelte | 5 +++--
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/lib/components/Checklist.svelte b/src/lib/components/Checklist.svelte
index 79507fc..33c0973 100644
--- a/src/lib/components/Checklist.svelte
+++ b/src/lib/components/Checklist.svelte
@@ -120,7 +120,7 @@
 		class="space-y-1"
 	>
 		{#each activeItems as item (item.id)}
-			<div class="group flex items-center gap-1" animate:flip={{ duration: flipDurationMs }}>
+			<div class="group flex items-center gap-2" animate:flip={{ duration: flipDurationMs }}>
 				<div use:dragHandle aria-label="drag handle" class="drag-handle cursor-grab opacity-0 group-hover:opacity-100 focus:opacity-100 transition-opacity duration-150" data-testid="checklist-drag-handle">
 					<GripVertical class="h-4 w-4 text-[var(--text-muted)]" />
 				</div>
diff --git a/src/lib/components/NoteEditor.svelte b/src/lib/components/NoteEditor.svelte
index 8d53303..d823879 100644
--- a/src/lib/components/NoteEditor.svelte
+++ b/src/lib/components/NoteEditor.svelte
@@ -30,7 +30,7 @@
 	// svelte-ignore state_referenced_locally
 	let checklistMode = $state(note?.checklistMode ?? false);
 	let showColorPicker = $state(false);
-	let rawMarkdownMode = $state(false);
+	let rawMarkdownMode = $state(note?.checklistMode ?? false);
 	let textareaEl: HTMLTextAreaElement | undefined = $state();
 	let tiptapEditor: Editor | undefined = $state();
 	let editorTick = $state(0);
@@ -166,8 +166,9 @@
 				<!-- Raw markdown mode toggle -->
 				<button
 					onclick={toggleMarkdownMode}
-					class="rounded-sm p-2 hover:bg-[var(--border)]/10"
+					class="rounded-sm p-2 hover:bg-[var(--border)]/10 disabled:opacity-30 disabled:cursor-not-allowed"
 					title={rawMarkdownMode ? 'Rich text mode' : 'Markdown mode'}
+					disabled={checklistMode}
 					data-testid="markdown-toggle"
 				>
 					{#if rawMarkdownMode}