till/managarten
1
0
Fork 0
mirror of https://github.com/Memo-2023/mana-monorepo.git synced 2026-05-14 20:01:09 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

fix(mobile): disable text selection on list rows to unblock long-press context menu

Browse source 
On mobile, long-press was selecting the row text instead of firing
`contextmenu`. Adds `user-select: none` + `-webkit-touch-callout: none`
on collapsed rows across 12 ListViews (notes, todo, dreams, journal,
firsts, contacts, places, mail, moodlit, chat, calendar) and re-enables
`user-select: text` on the inline-editor variants so the textarea
stays selectable while editing.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Till JS 2026-04-17 15:08:04 +02:00
parent 49f315f6be
commit e60965ee19
12 changed files with 44 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

3
apps/mana/apps/web/src/lib/modules/calendar/ListView.svelte
View file

@ -309,6 +309,9 @@
cursor: pointer;
border-radius: 0.25rem;
transition: background 0.15s;
user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none;
}
.event-row:hover {
background: hsl(var(--color-surface-hover));

3
apps/mana/apps/web/src/lib/modules/chat/ListView.svelte
View file

@ -179,6 +179,9 @@
cursor: pointer;
transition: background 0.15s;
min-height: 44px;
user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none;
}
.conv-item:hover {
background: hsl(var(--color-surface-hover));

3
apps/mana/apps/web/src/lib/modules/contacts/ListView.svelte
View file

@ -237,6 +237,9 @@
cursor: pointer;
text-align: left;
transition: background 0.15s;
user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none;
}
.contact-item:hover {
background: hsl(var(--color-surface-hover));

6
apps/mana/apps/web/src/lib/modules/dreams/ListView.svelte
View file

@ -634,6 +634,9 @@
border-radius: 0.25rem;
cursor: pointer;
transition: background 0.15s;
user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none;
}
.dream-item:hover {
background: hsl(var(--color-surface-hover));
@ -764,6 +767,9 @@
border: 1px solid hsl(var(--color-primary) / 0.3);
border-radius: 0.375rem;
background: hsl(var(--color-primary) / 0.03);
user-select: text;
-webkit-user-select: text;
-webkit-touch-callout: default;
}
.dream-item.editing:hover {
background: hsl(var(--color-primary) / 0.03);

6
apps/mana/apps/web/src/lib/modules/firsts/ListView.svelte
View file

@ -915,6 +915,9 @@
background: transparent;
cursor: pointer;
transition: all 0.15s;
user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none;
}
.entry-card:hover {
background: hsl(var(--color-surface-hover));
@ -1088,6 +1091,9 @@
cursor: default;
border-color: hsl(var(--color-primary) / 0.3);
background: hsl(var(--color-primary) / 0.03);
user-select: text;
-webkit-user-select: text;
-webkit-touch-callout: default;
}
.entry-card.editing:hover,
.entry-card.converting:hover {

6
apps/mana/apps/web/src/lib/modules/journal/ListView.svelte
View file

@ -586,6 +586,9 @@
border-radius: 0.25rem;
cursor: pointer;
transition: background 0.15s;
user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none;
}
.entry-item:hover {
background: hsl(var(--color-surface-hover));
@ -689,6 +692,9 @@
border: 1px solid hsl(var(--color-primary) / 0.3);
border-radius: 0.375rem;
background: hsl(var(--color-primary) / 0.03);
user-select: text;
-webkit-user-select: text;
-webkit-touch-callout: default;
}
.entry-item.editing:hover {
background: hsl(var(--color-primary) / 0.03);

3
apps/mana/apps/web/src/lib/modules/mail/ListView.svelte
View file

@ -337,6 +337,9 @@
cursor: pointer;
transition: background 0.15s;
color: hsl(var(--color-muted-foreground));
user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none;
}
.thread-row:hover {
background: hsl(var(--color-muted));

2
apps/mana/apps/web/src/lib/modules/moodlit/ListView.svelte
View file

@ -220,7 +220,7 @@
<button
onclick={() => (fullscreenMood = mood)}
oncontextmenu={(e) => ctxMenu.open(e, mood)}
class="mood-card group relative aspect-[4/3] w-full overflow-hidden rounded-xl border-2 border-transparent transition-all duration-200 hover:border-white/40 focus:outline-none"
class="mood-card group relative aspect-[4/3] w-full select-none overflow-hidden rounded-xl border-2 border-transparent transition-all duration-200 [-webkit-touch-callout:none] hover:border-white/40 focus:outline-none"
style="--mood-color: {mood.colors[0]}"
>
<div

6
apps/mana/apps/web/src/lib/modules/notes/ListView.svelte
View file

@ -276,6 +276,9 @@
border-radius: 0.25rem;
cursor: pointer;
transition: background 0.15s;
user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none;
}
.note-item:hover {
background: hsl(var(--color-surface-hover));
@ -343,6 +346,9 @@
border: 1px solid hsl(var(--color-primary) / 0.3);
border-radius: 0.375rem;
background: hsl(var(--color-primary) / 0.04);
user-select: text;
-webkit-user-select: text;
-webkit-touch-callout: default;
}
.note-item.editing:hover {
background: hsl(var(--color-primary) / 0.04);

3
apps/mana/apps/web/src/lib/modules/places/ListView.svelte
View file

@ -900,6 +900,9 @@
text-align: left;
transition: background 0.15s;
width: 100%;
user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none;
}
.place-item:hover {

3
apps/mana/apps/web/src/lib/modules/todo/ListView.svelte
View file

@ -245,6 +245,9 @@
cursor: pointer;
transition: background 0.15s;
border-radius: 0.25rem;
user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none;
}
.task-item:hover {
background: hsl(var(--color-surface-hover));

2
apps/mana/apps/web/src/lib/modules/todo/components/TaskItem.svelte
View file

@ -52,7 +52,7 @@
</script>
<div
class="group flex items-start gap-3 rounded-lg border border-transparent px-3 transition-colors hover:border-border hover:bg-card {compact
class="group flex select-none items-start gap-3 rounded-lg border border-transparent px-3 transition-colors [-webkit-touch-callout:none] hover:border-border hover:bg-card {compact
? 'py-1.5'
: 'py-2.5'}"
role="button"