From 23fd2da91e434bd6ff880d38758a0998ff571aa9 Mon Sep 17 00:00:00 2001 From: Bryan Van Deusen Date: Wed, 26 Aug 2026 17:17:32 -0400 Subject: [PATCH] The tag goes at the top of the card, where it gets looked at MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Label chips sat under the body, the checklist, the attachments and the link previews. On a tall note that puts the one thing saying what a note IS below the fold of a glance — and a board is scanned, not read. "Which of these is about the thing I am looking for" should be the first thing the eye lands on. Above the body rather than beside it: the body's first line is the note's NAME (M13 steps 3 and 4), and a chip floated next to it would compete with the thing that identifies the note. A row of its own costs one line, and only on notes that carry tags. Both surfaces, same order. Does not depend on tag lifting, which is a much larger change — see the task. Co-Authored-By: Claude Opus 5 --- .../fabledsword/thoughtsync/ui/NoteCard.kt | 25 +++++++++++------ frontend/src/components/NoteCard.vue | 28 ++++++++++++------- 2 files changed, 35 insertions(+), 18 deletions(-) diff --git a/android/app/src/main/java/com/fabledsword/thoughtsync/ui/NoteCard.kt b/android/app/src/main/java/com/fabledsword/thoughtsync/ui/NoteCard.kt index 019fcb5..a9db112 100644 --- a/android/app/src/main/java/com/fabledsword/thoughtsync/ui/NoteCard.kt +++ b/android/app/src/main/java/com/fabledsword/thoughtsync/ui/NoteCard.kt @@ -58,9 +58,23 @@ fun NoteCard( .border(1.dp, if (dark) CARD_EDGE_DARK else CARD_EDGE_LIGHT, RoundedCornerShape(CARD_RADIUS)) .padding(12.dp), ) { - // Body then checklist, in order — a note can carry both (M13 step 2), and - // nothing above them: the first line of the body IS the note's name, at the - // same weight as the rest of it (M13 steps 3 and 4). + // TAGS FIRST. They used to sit under everything else, which on a tall note put + // the one thing that says what a note IS below the fold of a glance. A board is + // scanned, not read, and the answer to "which of these is about the thing I am + // looking for" should be the first thing the eye lands on rather than the last. + // + // Above the body rather than beside it, because the body's first line is the + // note's NAME (M13 steps 3 and 4) and a chip floated next to it would compete + // with the thing that identifies the note. A row of its own costs one line and + // only on notes that have tags at all. + if (note.labels.isNotEmpty()) { + LabelChips(labels = note.labels) + Spacer(Modifier.height(8.dp)) + } + + // Body then checklist, in order — a note can carry both (M13 step 2). The + // first line of the body IS the note's name, at the same weight as the rest of + // it (M13 steps 3 and 4). if (note.body.isNotBlank()) { NoteBody(note = note, onToggleItem = onToggleItem) } @@ -76,11 +90,6 @@ fun NoteCard( ) } - if (note.labels.isNotEmpty()) { - Spacer(Modifier.height(8.dp)) - LabelChips(labels = note.labels) - } - note.remindAt?.let { at -> Spacer(Modifier.height(8.dp)) ReminderChip(instant = at, recurrence = note.recurrence) diff --git a/frontend/src/components/NoteCard.vue b/frontend/src/components/NoteCard.vue index 46f5cfe..efe6e36 100644 --- a/frontend/src/components/NoteCard.vue +++ b/frontend/src/components/NoteCard.vue @@ -259,6 +259,24 @@ onBeforeUnmount(() => document.removeEventListener("mousedown", onDocMousedown)) `shadow-sm`, back down from `shadow`: the border is the boundary again, so the shadow is only depth. --> + +
+ {{ lb.via_tag ? "#" + lb.name : lb.name }} +
+ document.removeEventListener("mousedown", onDocMousedown)) two paragraphs instead of always after them. Rendering both would have shown every list twice. --> -
- {{ lb.via_tag ? "#" + lb.name : lb.name }} -
-