From 00248e7c913a9608d47142a7a7a3f17eadfa4345 Mon Sep 17 00:00:00 2001
From: kolaente <k@knt.li>
Date: Mon, 27 Feb 2023 17:13:36 +0100
Subject: [PATCH 1/3] Revert "fix(task): allow clicking on the whole task to
 open the task detail view"

This reverts commit fe764a46e931ae79f1651f4a669a8c777e260f16.
---
 src/components/input/fancycheckbox.vue        |  7 +----
 .../tasks/partials/singleTaskInList.vue       | 28 ++++++++++---------
 2 files changed, 16 insertions(+), 19 deletions(-)

diff --git a/src/components/input/fancycheckbox.vue b/src/components/input/fancycheckbox.vue
index 43f55b7db..8c844bd6d 100644
--- a/src/components/input/fancycheckbox.vue
+++ b/src/components/input/fancycheckbox.vue
@@ -7,7 +7,7 @@
 			@change="(event: Event) => updateData((event.target as HTMLInputElement).checked)"
 			type="checkbox"
 		/>
-		<label :for="checkBoxId" class="check" @click.prevent="check">
+		<label :for="checkBoxId" class="check">
 			<svg height="18px" viewBox="0 0 18 18" width="18px">
 				<path
 					d="M1,9 L1,3.5 C1,2 2,1 3.5,1 L14.5,1 C16,1 17,2 17,3.5 L17,14.5 C17,16 16,17 14.5,17 L3.5,17 C2,17 1,16 1,14.5 L1,9 Z"></path>
@@ -56,11 +56,6 @@ function updateData(newChecked: boolean) {
 	emit('update:modelValue', newChecked)
 	emit('change', newChecked)
 }
-
-function check() {
-	checked.value = !checked.value
-	updateData(checked.value)
-}
 </script>
 
 
diff --git a/src/components/tasks/partials/singleTaskInList.vue b/src/components/tasks/partials/singleTaskInList.vue
index 1056cbaac..b203d41fd 100644
--- a/src/components/tasks/partials/singleTaskInList.vue
+++ b/src/components/tasks/partials/singleTaskInList.vue
@@ -1,9 +1,5 @@
 <template>
-	<router-link
-		:to="taskDetailRoute"
-		:class="{'is-loading': taskService.loading}"
-		class="task loader-container"
-	>
+	<div :class="{'is-loading': taskService.loading}" class="task loader-container">
 		<fancycheckbox
 			:disabled="(isArchived || disabled) && !canMarkAsDone"
 			@change="markAsDone"
@@ -16,7 +12,8 @@
 			class="mr-1"
 		/>
 		
-		<div
+		<router-link
+			:to="taskDetailRoute"
 			:class="{ 'done': task.done, 'show-list': showList && taskList !== null}"
 			class="tasktext"
 		>
@@ -96,7 +93,7 @@
 			</span>
 
 			<checklist-summary :task="task"/>
-		</div>
+		</router-link>
 
 		<progress
 			class="progress is-small"
@@ -117,14 +114,14 @@
 
 		<BaseButton
 			:class="{'is-favorite': task.isFavorite}"
-			@click.prevent="toggleFavorite"
+			@click="toggleFavorite"
 			class="favorite"
 		>
 			<icon icon="star" v-if="task.isFavorite"/>
 			<icon :icon="['far', 'star']" v-else/>
 		</BaseButton>
 		<slot />
-	</router-link>
+	</div>
 </template>
 
 <script setup lang="ts">
@@ -287,12 +284,8 @@ function hideDeferDueDatePopup(e) {
 	cursor: pointer;
 	border-radius: $radius;
 	border: 2px solid transparent;
-	
-	color: var(--text);
-	transition: color ease $transition-duration;
 
 	&:hover {
-		color: var(--grey-900);
 		background-color: var(--grey-100);
 	}
 
@@ -338,6 +331,15 @@ function hideDeferDueDatePopup(e) {
 
 	}
 
+	a {
+		color: var(--text);
+		transition: color ease $transition-duration;
+
+		&:hover {
+			color: var(--grey-900);
+		}
+	}
+
 	.favorite {
 		opacity: 0;
 		text-align: center;
-- 
2.40.1


From 5e9ed290acaac92dbf34ab4d80e3fdb3102ac69b Mon Sep 17 00:00:00 2001
From: kolaente <k@knt.li>
Date: Mon, 27 Feb 2023 17:37:02 +0100
Subject: [PATCH 2/3] fix(task): don't wrap the whole task item in an a element

---
 .../tasks/partials/singleTaskInList.vue          | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/components/tasks/partials/singleTaskInList.vue b/src/components/tasks/partials/singleTaskInList.vue
index b203d41fd..4ed734739 100644
--- a/src/components/tasks/partials/singleTaskInList.vue
+++ b/src/components/tasks/partials/singleTaskInList.vue
@@ -1,5 +1,5 @@
 <template>
-	<div :class="{'is-loading': taskService.loading}" class="task loader-container">
+	<div :class="{'is-loading': taskService.loading}" class="task loader-container" @click.stop.self="openTaskDetail">
 		<fancycheckbox
 			:disabled="(isArchived || disabled) && !canMarkAsDone"
 			@change="markAsDone"
@@ -127,13 +127,14 @@
 <script setup lang="ts">
 import {ref, watch, shallowReactive, toRef, type PropType, onMounted, onBeforeUnmount, computed} from 'vue'
 import {useI18n} from 'vue-i18n'
+import {useRouter} from 'vue-router'
 
 import TaskModel, { getHexColor } from '@/models/task'
 import type {ITask} from '@/modelTypes/ITask'
 
 import PriorityLabel from '@/components/tasks/partials/priorityLabel.vue'
-import Labels from '@/components/tasks/partials//labels.vue'
-import DeferTask from '@/components/tasks/partials//defer-task.vue'
+import Labels from '@/components/tasks/partials/labels.vue'
+import DeferTask from '@/components/tasks/partials/defer-task.vue'
 import ChecklistSummary from '@/components/tasks/partials/checklist-summary.vue'
 
 import User from '@/components/misc/user.vue'
@@ -183,6 +184,7 @@ const props = defineProps({
 const emit = defineEmits(['task-updated'])
 
 const {t} = useI18n({useScope: 'global'})
+const router = useRouter()
 
 const taskService = shallowReactive(new TaskService())
 const task = ref<ITask>(new TaskModel())
@@ -272,6 +274,14 @@ function hideDeferDueDatePopup(e) {
 		showDefer.value = false
 	})
 }
+
+const taskLink = ref(null)
+function openTaskDetail() {
+	const isTextSelected = window.getSelection().toString()
+	if (!isTextSelected) {
+		router.push(taskDetailRoute.value)
+	}
+}
 </script>
 
 <style lang="scss" scoped>
-- 
2.40.1


From 4924470f2b2d734cdb50292adb834b2a37f5d7c7 Mon Sep 17 00:00:00 2001
From: kolaente <k@knt.li>
Date: Mon, 27 Feb 2023 17:47:06 +0100
Subject: [PATCH 3/3] fix(task): task link focus style

---
 src/components/tasks/partials/singleTaskInList.vue | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/components/tasks/partials/singleTaskInList.vue b/src/components/tasks/partials/singleTaskInList.vue
index 4ed734739..8bf9cf25f 100644
--- a/src/components/tasks/partials/singleTaskInList.vue
+++ b/src/components/tasks/partials/singleTaskInList.vue
@@ -299,6 +299,14 @@ function openTaskDetail() {
 		background-color: var(--grey-100);
 	}
 
+	&:focus-within {
+		box-shadow: 0 0 0 2px hsla(var(--primary-hsl), 0.5);
+		
+		a.tasktext {
+			box-shadow: none;
+		}
+	}
+
 	.tasktext,
 	&.tasktext {
 		white-space: nowrap;
@@ -366,7 +374,8 @@ function openTaskDetail() {
 		}
 	}
 
-	&:hover .favorite {
+	&:hover .favorite,
+	.favorite:focus {
 		opacity: 1;
 	}
 
-- 
2.40.1