Merge branch 'main' into feature/date-math

package.json

@@ -20,12 +20,12 @@
   "dependencies": {
     "@github/hotkey": "2.0.0",
     "@kyvg/vue3-notification": "2.3.4",
-    "@sentry/tracing": "6.18.0",
+    "@sentry/tracing": "6.19.2",
-    "@sentry/vue": "6.18.0",
+    "@sentry/vue": "6.19.2",
     "@types/is-touch-device": "1.0.0",
     "@vue/compat": "3.2.31",
-    "@vueuse/core": "7.7.0",
+    "@vueuse/core": "8.2.0",
-    "@vueuse/router": "7.7.0",
+    "@vueuse/router": "8.2.0",
     "bulma-css-variables": "0.9.33",
     "camel-case": "4.1.2",
     "codemirror": "5.65.2",
@@ -33,64 +33,64 @@
     "date-fns": "2.28.0",
     "dompurify": "2.3.6",
     "easymde": "2.16.1",
-    "flatpickr": "4.6.9",
+    "flatpickr": "4.6.11",
     "flexsearch": "0.7.21",
-    "highlight.js": "11.4.0",
+    "highlight.js": "11.5.0",
     "is-touch-device": "1.0.1",
     "lodash.clonedeep": "4.5.0",
     "lodash.debounce": "4.0.8",
     "marked": "4.0.12",
     "register-service-worker": "1.7.2",
     "snake-case": "3.0.4",
-    "ufo": "0.7.11",
+    "ufo": "0.8.1",
     "v-tooltip": "4.0.0-beta.17",
     "vue": "3.2.31",
     "vue-advanced-cropper": "2.8.1",
     "vue-drag-resize": "2.0.3",
     "vue-flatpickr-component": "9.0.5",
     "vue-i18n": "9.2.0-beta.30",
-    "vue-router": "4.0.12",
+    "vue-router": "4.0.14",
     "vuedraggable": "4.1.0",
     "vuex": "4.0.2",
-    "workbox-precaching": "6.5.0"
+    "workbox-precaching": "6.5.2"
   },
   "devDependencies": {
     "@4tw/cypress-drag-drop": "2.1.0",
-    "@faker-js/faker": "6.0.0-alpha.7",
+    "@faker-js/faker": "6.0.0",
-    "@fortawesome/fontawesome-svg-core": "1.3.0",
+    "@fortawesome/fontawesome-svg-core": "6.1.1",
-    "@fortawesome/free-regular-svg-icons": "5.15.4",
+    "@fortawesome/free-regular-svg-icons": "6.1.1",
-    "@fortawesome/free-solid-svg-icons": "5.15.4",
+    "@fortawesome/free-solid-svg-icons": "6.1.1",
     "@fortawesome/vue-fontawesome": "3.0.0-5",
-    "@types/flexsearch": "0.7.2",
+    "@types/flexsearch": "0.7.3",
-    "@typescript-eslint/eslint-plugin": "5.12.1",
+    "@typescript-eslint/eslint-plugin": "5.16.0",
-    "@typescript-eslint/parser": "5.12.1",
+    "@typescript-eslint/parser": "5.16.0",
     "@vitejs/plugin-legacy": "1.7.1",
-    "@vitejs/plugin-vue": "2.2.2",
+    "@vitejs/plugin-vue": "2.2.4",
     "@vue/eslint-config-typescript": "10.0.0",
-    "autoprefixer": "10.4.2",
+    "autoprefixer": "10.4.4",
-    "axios": "0.26.0",
+    "axios": "0.26.1",
-    "browserslist": "4.19.3",
+    "browserslist": "4.20.2",
-    "caniuse-lite": "1.0.30001312",
+    "caniuse-lite": "1.0.30001320",
-    "cypress": "9.5.0",
+    "cypress": "9.5.2",
-    "esbuild": "0.14.23",
+    "esbuild": "0.14.28",
-    "eslint": "8.10.0",
+    "eslint": "8.12.0",
     "eslint-plugin-vue": "8.5.0",
     "express": "4.17.3",
-    "happy-dom": "2.41.0",
+    "happy-dom": "2.50.0",
-    "netlify-cli": "9.6.5",
+    "netlify-cli": "9.13.3",
-    "postcss": "8.4.7",
+    "postcss": "8.4.12",
-    "postcss-preset-env": "7.4.1",
+    "postcss-preset-env": "7.4.3",
-    "rollup": "2.68.0",
+    "rollup": "2.70.1",
     "rollup-plugin-visualizer": "5.6.0",
     "sass": "1.49.9",
-    "typescript": "4.5.5",
+    "typescript": "4.6.3",
-    "vite": "2.8.4",
+    "vite": "2.8.6",
     "vite-plugin-pwa": "0.11.13",
     "vite-svg-loader": "3.1.2",
-    "vitest": "0.5.7",
+    "vitest": "0.7.12",
-    "vue-tsc": "0.32.0",
+    "vue-tsc": "0.33.9",
     "wait-on": "6.0.1",
-    "workbox-cli": "6.5.0"
+    "workbox-cli": "6.5.2"
   },
   "eslintConfig": {
     "root": true,
@@ -144,5 +144,5 @@
     }
   },
   "license": "AGPL-3.0-or-later",
-  "packageManager": "yarn@1.22.17"
+  "packageManager": "yarn@1.22.18"
 }

src/components/home/contentAuth.vue

@@ -236,6 +236,11 @@ store.dispatch('labels/loadAllLabels')
   .app-content {
     padding: $navbar-height + 1.5rem 1.5rem 1rem 1.5rem;
 
+	// Used to make sure the spinner is always in the middle while loading
+	> .loader-container {
+      min-height: calc(100vh -  #{$navbar-height + 1.5rem + 1rem});
+	}
+
     @media screen and (max-width: $tablet) {
       margin-left: 0;
       padding-top: 1.5rem;
@@ -264,7 +269,9 @@ store.dispatch('labels/loadAllLabels')
 	bottom: 0;
 	left: 0;
 	right: 0;
-	background: rgba(250, 250, 250, 0.8);
+	height: 100vh;
+	width: 100vw;
+	background: hsla(var(--grey-100-hsl), 0.8);
 	z-index: 5;
 	opacity: 0;
 	transition: all $transition;

src/components/home/navigation.vue

@@ -6,7 +6,7 @@
 			</router-link>
 			<ul class="menu-list">
 				<li>
-					<router-link :to="{ name: 'home'}">
+					<router-link :to="{ name: 'home'}" v-shortcut="'g o'">
 						<span class="icon">
 							<icon icon="calendar"/>
 						</span>
@@ -14,7 +14,7 @@
 					</router-link>
 				</li>
 				<li>
-					<router-link :to="{ name: 'tasks.range'}">
+					<router-link :to="{ name: 'tasks.range'}" v-shortcut="'g u'">
 						<span class="icon">
 							<icon :icon="['far', 'calendar-alt']"/>
 						</span>
@@ -22,7 +22,7 @@
 					</router-link>
 				</li>
 				<li>
-					<router-link :to="{ name: 'namespaces.index'}">
+					<router-link :to="{ name: 'namespaces.index'}" v-shortcut="'g n'">
 						<span class="icon">
 							<icon icon="layer-group"/>
 						</span>
@@ -30,7 +30,7 @@
 					</router-link>
 				</li>
 				<li>
-					<router-link :to="{ name: 'labels.index'}">
+					<router-link :to="{ name: 'labels.index'}" v-shortcut="'g a'">
 						<span class="icon">
 							<icon icon="tags"/>
 						</span>
@@ -38,7 +38,7 @@
 					</router-link>
 				</li>
 				<li>
-					<router-link :to="{ name: 'teams.index'}">
+					<router-link :to="{ name: 'teams.index'}" v-shortcut="'g m'">
 						<span class="icon">
 							<icon icon="users"/>
 						</span>

src/components/input/multiselect.vue

@@ -450,7 +450,6 @@ export default {
 
 		button {
 			background: transparent;
-			display: block;
 			text-align: left;
 			box-shadow: none;
 			border-radius: 0;
@@ -460,6 +459,7 @@ export default {
 			padding: .5rem;
 			border: none;
 			cursor: pointer;
+			color: var(--grey-800);
 
 			display: flex;
 			justify-content: space-between;

src/components/input/password.vue

@@ -16,7 +16,7 @@
 		<a
 			@click="togglePasswordFieldType"
 			class="password-field-type-toggle"
-			aria-label="passwordFieldType === 'password' ? $t('user.auth.showPassword') : $t('user.auth.hidePassword')"
+			:aria-label="passwordFieldType === 'password' ? $t('user.auth.showPassword') : $t('user.auth.hidePassword')"
 			v-tooltip="passwordFieldType === 'password' ? $t('user.auth.showPassword') : $t('user.auth.hidePassword')">
 			<icon :icon="passwordFieldType === 'password' ? 'eye' : 'eye-slash'"/>
 		</a>

src/components/misc/keyboard-shortcuts/index.vue

@@ -6,9 +6,13 @@
 
 				<message class="mb-4" v-if="s.available">
 					{{
+						typeof s.available === 'undefined' ?
+							$t('keyboardShortcuts.allPages') :
+							(
 								s.available($route)
 									? $t('keyboardShortcuts.currentPageOnly')
-							: $t('keyboardShortcuts.allPages')
+									: $t('keyboardShortcuts.somePagesOnly')
+							)
 					}}
 				</message>
 
@@ -38,6 +42,7 @@ import {KEYBOARD_SHORTCUTS_ACTIVE} from '@/store/mutation-types'
 import {KEYBOARD_SHORTCUTS as shortcuts} from './shortcuts'
 
 const store = useStore()
+
 function close() {
 	store.commit(KEYBOARD_SHORTCUTS_ACTIVE, false)
 }

src/components/misc/keyboard-shortcuts/shortcuts.ts

@@ -30,6 +30,36 @@ export const KEYBOARD_SHORTCUTS : ShortcutGroup[] = [
 			},
 		],
 	},
+	{
+		title: 'keyboardShortcuts.navigation.title',
+		shortcuts: [
+			{
+				title: 'keyboardShortcuts.navigation.overview',
+				keys: ['g', 'o'],
+				combination: 'then',
+			},
+			{
+				title: 'keyboardShortcuts.navigation.upcoming',
+				keys: ['g', 'u'],
+				combination: 'then',
+			},
+			{
+				title: 'keyboardShortcuts.navigation.namespaces',
+				keys: ['g', 'n'],
+				combination: 'then',
+			},
+			{
+				title: 'keyboardShortcuts.navigation.labels',
+				keys: ['g', 'a'],
+				combination: 'then',
+			},
+			{
+				title: 'keyboardShortcuts.navigation.teams',
+				keys: ['g', 'm'],
+				combination: 'then',
+			},
+		],
+	},
 	{
 		title: 'list.kanban.title',
 		available: (route) => route.name === 'list.kanban',
@@ -70,6 +100,10 @@ export const KEYBOARD_SHORTCUTS : ShortcutGroup[] = [
 		title: 'keyboardShortcuts.task.title',
 		available: (route) => route.name === 'task.detail',
 		shortcuts: [
+			{
+				title: 'keyboardShortcuts.task.done',
+				keys: ['t'],
+			},
 			{
 				title: 'keyboardShortcuts.task.assign',
 				keys: ['a'],
@@ -90,6 +124,14 @@ export const KEYBOARD_SHORTCUTS : ShortcutGroup[] = [
 				title: 'keyboardShortcuts.task.related',
 				keys: ['r'],
 			},
+			{
+				title: 'keyboardShortcuts.task.move',
+				keys: ['m'],
+			},
+			{
+				title: 'keyboardShortcuts.task.color',
+				keys: ['c'],
+			},
 		],
 	},
 ]

src/components/modal/modal.vue

@@ -210,14 +210,14 @@ export default {
 	font-size: 2rem;
 
 	@media screen and (max-width: $desktop) {
-		color: var(--dark);
+		color: var(--grey-900);
 	}
 }
 </style>
 
 <style lang="scss">
 // Close icon SVG uses currentColor, change the color to keep it visible
-.dark .task-detail-view-modal .close {
+.dark .close {
 	color: var(--grey-900);
 }
 </style>

src/components/tasks/add-task.vue

@@ -5,6 +5,7 @@
 				<textarea
 					:disabled="taskService.loading || undefined"
 					class="add-task-textarea input"
+					:class="{'textarea-empty': newTaskTitle === ''}"
 					:placeholder="$t('list.list.addPlaceholder')"
 					rows="1"
 					v-focus
@@ -24,15 +25,18 @@
 					@click="addTask()"
 					icon="plus"
 					:loading="taskService.loading"
+					:aria-label="$t('list.list.add')"
 				>
+					<span class="button-text">
 						{{ $t('list.list.add') }}
+					</span>
 				</x-button>
 			</p>
 		</div>
 		<p class="help is-danger" v-if="errorMessage !== ''">
 			{{ errorMessage }}
 		</p>
-		<quick-add-magic v-else />
+		<quick-add-magic v-else/>
 	</div>
 </template>
 
@@ -40,7 +44,7 @@
 import {ref, watch, unref, shallowReactive} from 'vue'
 import {useI18n} from 'vue-i18n'
 import {useStore} from 'vuex'
-import { tryOnMounted, debouncedWatch, useWindowSize, MaybeRef } from '@vueuse/core'
+import {tryOnMounted, debouncedWatch, useWindowSize, MaybeRef} from '@vueuse/core'
 
 import TaskService from '@/services/task'
 import QuickAddMagic from '@/components/tasks/partials/quick-add-magic.vue'
@@ -54,12 +58,12 @@ function useAutoHeightTextarea(value: MaybeRef<string>) {
 	const minHeight = ref(0)
 
 	// adapted from https://github.com/LeaVerou/stretchy/blob/47f5f065c733029acccb755cae793009645809e2/src/stretchy.js#L34
-	function resize(textareaEl: HTMLInputElement|undefined) {
+	function resize(textareaEl: HTMLInputElement | undefined) {
 		if (!textareaEl) return
 
 		let empty
 
-		// the value here is the the attribute value
+		// the value here is the attribute value
 		if (!textareaEl.value && textareaEl.placeholder) {
 			empty = true
 			textareaEl.value = textareaEl.placeholder
@@ -95,12 +99,12 @@ function useAutoHeightTextarea(value: MaybeRef<string>) {
 		}
 	})
 
-	const { width: windowWidth } = useWindowSize()
+	const {width: windowWidth} = useWindowSize()
 
 	debouncedWatch(
 		windowWidth,
 		() => resize(textarea.value),
-		{ debounce: 200 },
+		{debounce: 200},
 	)
 
 	// It is not possible to get notified of a change of the value attribute of a textarea without workarounds (setTimeout) 
@@ -129,14 +133,14 @@ const emit = defineEmits(['taskAdded'])
 const newTaskTitle = ref('')
 const newTaskInput = useAutoHeightTextarea(newTaskTitle)
 
-const { t } = useI18n()
+const {t} = useI18n()
 const store = useStore()
 
 const taskService = shallowReactive(new TaskService())
 const errorMessage = ref('')
 
 function resetEmptyTitleError() {
-	if(newTaskTitle.value !== '') {
+	if (newTaskTitle.value !== '') {
 		errorMessage.value = ''
 	}
 }
@@ -200,9 +204,26 @@ function handleEnter(e: KeyboardEvent) {
 
 .add-task-button {
 	height: 2.5rem;
+
+	@media screen and (max-width: $mobile) {
+		.button-text {
+			display: none;
+		}
+		
+		:deep(.icon) {
+			margin: 0 !important;
+		}
+	}
 }
+
 .add-task-textarea {
 	transition: border-color $transition;
 	resize: none;
 }
+
+// Adding this class when the textarea has no text prevents the textarea from wrapping the placeholder.
+.textarea-empty {
+	white-space: nowrap;
+	text-overflow: ellipsis;
+}
 </style>

src/components/tasks/partials/relatedTasks.vue

@@ -83,7 +83,7 @@
 			<span class="title">{{ rts.title }}</span>
 			<div class="tasks">
 				<div :key="t.id" class="task" v-for="t in rts.tasks">
-					<router-link :to="{ name: $route.name, params: { id: t.id } }" :class="{ 'done': t.done}">
+					<router-link :to="{ name: $route.name, params: { id: t.id } }" :class="{ 'is-strikethrough': t.done}">
 						<span
 							class="different-list"
 							v-if="t.listId !== listId"

src/i18n/lang/cs-CZ.json

@@ -785,17 +785,20 @@
     "general": "Obecné",
     "allPages": "Tyto zkratky fungují na všech stránkách.",
     "currentPageOnly": "Tyto zkratky fungují pouze na aktuální stránce.",
+    "somePagesOnly": "These shortcuts work only on some pages.",
     "toggleMenu": "Přepnout nabídku",
     "quickSearch": "Otevřít vyhledávání / panel rychlých akcí",
     "then": "potom",
     "task": {
       "title": "Stránka úkolů",
-      "done": "Hotovo",
+      "done": "Mark task done / undone",
-      "assign": "Přiřadit uživateli",
+      "assign": "Assign this task to a user",
       "labels": "Přidat štítky k tomuto úkolu",
       "dueDate": "Změnit termín tohoto úkolu",
       "attachment": "Přidat přílohu k tomuto úkolu",
-      "related": "Upravit související úkoly tohoto úkolu"
+      "related": "Upravit související úkoly tohoto úkolu",
+      "color": "Change the color of this task",
+      "move": "Move this task to another list"
     },
     "list": {
       "title": "Zobrazení seznamů",
@@ -803,6 +806,14 @@
       "switchToGanttView": "Přepnout na zobrazení gantt",
       "switchToKanbanView": "Přepnout na zobrazení kanbanu",
       "switchToTableView": "Přepnout na zobrazení tabulky"
+    },
+    "navigation": {
+      "title": "Navigation",
+      "overview": "Navigato to overview",
+      "upcoming": "Navigato to upcoming taks",
+      "namespaces": "Navigate to namepaces & lists",
+      "labels": "Navigate to labels",
+      "teams": "Navigate to teams"
     }
   },
   "update": {

src/i18n/lang/de-DE.json

@@ -785,17 +785,20 @@
     "general": "Allgemein",
     "allPages": "Diese Tastenkürzel funktionieren auf allen Seiten.",
     "currentPageOnly": "Diese Tastenkürzel funktionieren nur auf der aktuellen Seite.",
+    "somePagesOnly": "Funktioniert nur auf manchen Seiten.",
     "toggleMenu": "Das Menü umschalten",
     "quickSearch": "Such-/Schnellaktionsleiste öffnen",
     "then": "dann",
     "task": {
       "title": "Aufgabenseite",
-      "done": "Fertig",
+      "done": "Aufgabe als erledigt / unerledigt markieren",
-      "assign": "Benutzer:in zuweisen",
+      "assign": "Diese Aufgabe jemandem zuweisen",
       "labels": "Dieser Aufgabe ein Label hinzufügen",
       "dueDate": "Ändere das Fälligkeitsdatum dieser Aufgabe",
       "attachment": "Einen Anhang dieser Aufgabe hinzufügen",
-      "related": "Ändere die Abhängigen Aufgaben dieser Aufgabe"
+      "related": "Ändere die Abhängigen Aufgaben dieser Aufgabe",
+      "color": "Die Farbe dieser Aufgabe ändern",
+      "move": "Diese Aufgabe in eine andere Liste verschieben"
     },
     "list": {
       "title": "Listenansicht",
@@ -803,6 +806,14 @@
       "switchToGanttView": "Zur Ganttansicht wechseln",
       "switchToKanbanView": "Zur Kanbanansicht wechseln",
       "switchToTableView": "Zur Tabellenansicht wechseln"
+    },
+    "navigation": {
+      "title": "Navigation",
+      "overview": "Die Startseite aufrufen",
+      "upcoming": "Anstehende Aufgaben aufrufen",
+      "namespaces": "Namespaces & Listen aufrufen",
+      "labels": "Labels aufrufen",
+      "teams": "Teams aufrufen"
     }
   },
   "update": {

src/i18n/lang/de-swiss.json

@@ -785,17 +785,20 @@
     "general": "Allgemein",
     "allPages": "Die Chürzl funktioniered uf allne Siitene.",
     "currentPageOnly": "Die Chürzl funktioniered nur uf de momentane Siite.",
+    "somePagesOnly": "Funktioniert nur auf manchen Seiten.",
     "toggleMenu": "Menü umschalte",
     "quickSearch": "Suechi und Schnellaktionsliste öffne",
     "then": "dann",
     "task": {
       "title": "Uufgabesiite",
-      "done": "Fertig",
+      "done": "Aufgabe als erledigt / unerledigt markieren",
-      "assign": "Benutzer:in zuweisen",
+      "assign": "Diese Aufgabe jemandem zuweisen",
       "labels": "Labels ennere Uufgab hinzuefüege",
       "dueDate": "S'Fälligkeitsdatum für die Uufgab ändere",
       "attachment": "En Aahang dere Uufgab hinzuefüege",
-      "related": "Beziehige vo dere Uufgab bearbeite"
+      "related": "Beziehige vo dere Uufgab bearbeite",
+      "color": "Die Farbe dieser Aufgabe ändern",
+      "move": "Diese Aufgabe in eine andere Liste verschieben"
     },
     "list": {
       "title": "Listenansicht",
@@ -803,6 +806,14 @@
       "switchToGanttView": "Zur Ganttansicht wechseln",
       "switchToKanbanView": "Zur Kanbanansicht wechseln",
       "switchToTableView": "Zur Tabellenansicht wechseln"
+    },
+    "navigation": {
+      "title": "Navigation",
+      "overview": "Die Startseite aufrufen",
+      "upcoming": "Anstehende Aufgaben aufrufen",
+      "namespaces": "Namespaces & Listen aufrufen",
+      "labels": "Labels aufrufen",
+      "teams": "Teams aufrufen"
     }
   },
   "update": {

src/i18n/lang/en.json

@@ -837,17 +837,20 @@
     "general": "General",
     "allPages": "These shortcuts work on all pages.",
     "currentPageOnly": "These shortcuts work only on the current page.",
+    "somePagesOnly": "These shortcuts work only on some pages.",
     "toggleMenu": "Toggle The Menu",
     "quickSearch": "Open the search/quick action bar",
     "then": "then",
     "task": {
       "title": "Task Page",
-      "done": "Done",
+      "done": "Mark task done / undone",
-      "assign": "Assign to a user",
+      "assign": "Assign this task to a user",
       "labels": "Add labels to this task",
       "dueDate": "Change the due date of this task",
       "attachment": "Add an attachment to this task",
-      "related": "Modify related tasks of this task"
+      "related": "Modify related tasks of this task",
+      "color": "Change the color of this task",
+      "move": "Move this task to another list"
     },
     "list": {
       "title": "List Views",
@@ -855,6 +858,14 @@
       "switchToGanttView": "Switch to gantt view",
       "switchToKanbanView": "Switch to kanban view",
       "switchToTableView": "Switch to table view"
+    },
+    "navigation": {
+      "title": "Navigation",
+      "overview": "Navigato to overview",
+      "upcoming": "Navigato to upcoming taks",
+      "namespaces": "Navigate to namepaces & lists",
+      "labels": "Navigate to labels",
+      "teams": "Navigate to teams"
     }
   },
   "update": {

src/i18n/lang/es-ES.json

@@ -785,17 +785,20 @@
     "general": "General",
     "allPages": "These shortcuts work on all pages.",
     "currentPageOnly": "These shortcuts work only on the current page.",
+    "somePagesOnly": "These shortcuts work only on some pages.",
     "toggleMenu": "Toggle The Menu",
     "quickSearch": "Open the search/quick action bar",
     "then": "then",
     "task": {
       "title": "Task Page",
-      "done": "Done",
+      "done": "Mark task done / undone",
-      "assign": "Assign to a user",
+      "assign": "Assign this task to a user",
       "labels": "Add labels to this task",
       "dueDate": "Change the due date of this task",
       "attachment": "Add an attachment to this task",
-      "related": "Modify related tasks of this task"
+      "related": "Modify related tasks of this task",
+      "color": "Change the color of this task",
+      "move": "Move this task to another list"
     },
     "list": {
       "title": "List Views",
@@ -803,6 +806,14 @@
       "switchToGanttView": "Switch to gantt view",
       "switchToKanbanView": "Switch to kanban view",
       "switchToTableView": "Switch to table view"
+    },
+    "navigation": {
+      "title": "Navigation",
+      "overview": "Navigato to overview",
+      "upcoming": "Navigato to upcoming taks",
+      "namespaces": "Navigate to namepaces & lists",
+      "labels": "Navigate to labels",
+      "teams": "Navigate to teams"
     }
   },
   "update": {

src/i18n/lang/fr-FR.json

@@ -111,7 +111,7 @@
         "title": "Avatar",
         "initials": "Initiales",
         "gravatar": "Gravatar",
-        "marble": "Marble",
+        "marble": "Bille",
         "upload": "Téléverser",
         "uploadAvatar": "Téléverser l’avatar",
         "statusUpdateSuccess": "Statut de l’avatar mis à jour.",
@@ -385,7 +385,7 @@
       "showDoneTasks": "Afficher les tâches terminées",
       "sortAlphabetically": "Trier par ordre alphabétique",
       "enablePriority": "Activer le filtre par priorité",
-      "enablePercentDone": "Enable Filter By Progress",
+      "enablePercentDone": "Activer le filtre par progression",
       "dueDateRange": "Plage de dates d’échéance",
       "startDateRange": "Plage de dates de début",
       "endDateRange": "Plage de dates de fin",
@@ -570,22 +570,22 @@
         "text2": "Ceci supprimera également toutes les pièces jointes, les rappels et les relations associés à cette tâche et ne pourra pas être annulé !"
       },
       "actions": {
-        "assign": "Assign to User",
+        "assign": "Assigner à l'utilisateur",
-        "label": "Add Labels",
+        "label": "Ajouter des étiquettes",
         "priority": "Définir la priorité",
         "dueDate": "Définir l’échéance",
-        "startDate": "Set Start Date",
+        "startDate": "Définir la date de début",
-        "endDate": "Set End Date",
+        "endDate": "Définir la date de fin",
         "reminders": "Définir des rappels",
-        "repeatAfter": "Set Repeating Interval",
+        "repeatAfter": "Définir un intervalle de répétition",
-        "percentDone": "Set Progress",
+        "percentDone": "Définir la progression",
-        "attachments": "Add Attachments",
+        "attachments": "Ajouter des pièces jointes",
-        "relatedTasks": "Add Relation",
+        "relatedTasks": "Ajouter une relation",
-        "moveList": "Move",
+        "moveList": "Déplacer",
-        "color": "Set Color",
+        "color": "Définir la couleur",
-        "delete": "Delete",
+        "delete": "Supprimer",
-        "favorite": "Add to Favorites",
+        "favorite": "Ajouter aux favoris",
-        "unfavorite": "Remove from Favorites"
+        "unfavorite": "Retirer des favoris"
       }
     },
     "attributes": {
@@ -598,7 +598,7 @@
       "dueDate": "Date d’échéance",
       "endDate": "Date de fin",
       "labels": "Étiquettes",
-      "percentDone": "Progress",
+      "percentDone": "Progression",
       "priority": "Priorité",
       "relatedTasks": "Tâches connexes",
       "reminders": "Rappels",
@@ -785,17 +785,20 @@
     "general": "Général",
     "allPages": "Fonctionne sur toutes les pages.",
     "currentPageOnly": "Fonctionnent uniquement sur la page en cours.",
+    "somePagesOnly": "Ces raccourcis fonctionnent seulement sur certaines pages.",
     "toggleMenu": "Basculer le menu",
     "quickSearch": "Ouvrir la barre de recherche/action rapide",
     "then": "puis",
     "task": {
       "title": "Page de tâche",
-      "done": "Terminé",
+      "done": "Mark task done / undone",
-      "assign": "Attribuer à un utilisateur",
+      "assign": "Assigner cette tâche à un utilisateur",
       "labels": "Ajouter des étiquettes à cette tâche",
       "dueDate": "Modifier la date d’échéance de cette tâche",
       "attachment": "Ajouter une pièce jointe à cette tâche",
-      "related": "Modifier les tâches connexes de cette tâche"
+      "related": "Modifier les tâches connexes de cette tâche",
+      "color": "Changer la couleur de cette tâche",
+      "move": "Déplacer cette tâche dans une autre liste"
     },
     "list": {
       "title": "Vues en liste",
@@ -803,6 +806,14 @@
       "switchToGanttView": "Passer en vue Gantt",
       "switchToKanbanView": "Passer en vue kanban",
       "switchToTableView": "Passer en vue tableau"
+    },
+    "navigation": {
+      "title": "Navigation",
+      "overview": "Accéder à la vue d'ensemble",
+      "upcoming": "Accéder aux prochaines tâches",
+      "namespaces": "Accéder aux espaces de noms et listes",
+      "labels": "Accéder aux étiquettes",
+      "teams": "Accéder aux équipes"
     }
   },
   "update": {

src/i18n/lang/it-IT.json

@@ -785,17 +785,20 @@
     "general": "Generali",
     "allPages": "Queste scorciatoie funzionano in tutte le pagine.",
     "currentPageOnly": "Queste scorciatoie funzionano solo nella pagina attuale.",
+    "somePagesOnly": "These shortcuts work only on some pages.",
     "toggleMenu": "Attiva/Disattiva Menu",
     "quickSearch": "Apri la barra di ricerca/azione rapida",
     "then": "e dopo",
     "task": {
       "title": "Pagina Attività",
-      "done": "Fatto",
+      "done": "Mark task done / undone",
-      "assign": "Assegna a un utente",
+      "assign": "Assign this task to a user",
       "labels": "Aggiungi etichette a questa attività",
       "dueDate": "Modifica la data di scadenza di questa attività",
       "attachment": "Aggiungi un allegato a questa attività",
-      "related": "Modifica le attività collegate a questa"
+      "related": "Modifica le attività collegate a questa",
+      "color": "Change the color of this task",
+      "move": "Move this task to another list"
     },
     "list": {
       "title": "Viste Liste",
@@ -803,6 +806,14 @@
       "switchToGanttView": "Passa alla vista Gantt",
       "switchToKanbanView": "Passa alla vista Kanban",
       "switchToTableView": "Passa alla vista Tabella"
+    },
+    "navigation": {
+      "title": "Navigation",
+      "overview": "Navigato to overview",
+      "upcoming": "Navigato to upcoming taks",
+      "namespaces": "Navigate to namepaces & lists",
+      "labels": "Navigate to labels",
+      "teams": "Navigate to teams"
     }
   },
   "update": {

src/i18n/lang/nl-NL.json

@@ -785,17 +785,20 @@
     "general": "General",
     "allPages": "These shortcuts work on all pages.",
     "currentPageOnly": "These shortcuts work only on the current page.",
+    "somePagesOnly": "These shortcuts work only on some pages.",
     "toggleMenu": "Toggle The Menu",
     "quickSearch": "Open the search/quick action bar",
     "then": "then",
     "task": {
       "title": "Task Page",
-      "done": "Done",
+      "done": "Mark task done / undone",
-      "assign": "Assign to a user",
+      "assign": "Assign this task to a user",
       "labels": "Add labels to this task",
       "dueDate": "Change the due date of this task",
       "attachment": "Add an attachment to this task",
-      "related": "Modify related tasks of this task"
+      "related": "Modify related tasks of this task",
+      "color": "Change the color of this task",
+      "move": "Move this task to another list"
     },
     "list": {
       "title": "List Views",
@@ -803,6 +806,14 @@
       "switchToGanttView": "Switch to gantt view",
       "switchToKanbanView": "Switch to kanban view",
       "switchToTableView": "Switch to table view"
+    },
+    "navigation": {
+      "title": "Navigation",
+      "overview": "Navigato to overview",
+      "upcoming": "Navigato to upcoming taks",
+      "namespaces": "Navigate to namepaces & lists",
+      "labels": "Navigate to labels",
+      "teams": "Navigate to teams"
     }
   },
   "update": {

src/i18n/lang/pl-PL.json

@@ -785,17 +785,20 @@
     "general": "Ogólne",
     "allPages": "Te skróty działają na wszystkich stronach.",
     "currentPageOnly": "Te skróty działają tylko na bieżącej stronie.",
+    "somePagesOnly": "Te skróty działają tylko na niektórych stronach.",
     "toggleMenu": "Przełącz menu",
     "quickSearch": "Otwórz pasek wyszukiwania/szybkiej akcji",
     "then": "następnie",
     "task": {
       "title": "Widok zadań",
-      "done": "Ukończone",
+      "done": "Oznacz zadanie jako wykonane / niewykonane",
-      "assign": "Przypisz do użytkownika",
+      "assign": "Przypisz to zadanie do użytkownika",
       "labels": "Dodaj etykiety do tego zadania",
       "dueDate": "Zmień termin wykonania tego zadania",
       "attachment": "Dodaj załącznik do tego zadania",
-      "related": "Zmodyfikuj zadania powiązane z tym zadaniem"
+      "related": "Zmodyfikuj zadania powiązane z tym zadaniem",
+      "color": "Zmień kolor tego zadania",
+      "move": "Przenieś to zadanie do innej listy"
     },
     "list": {
       "title": "Widoki listy",
@@ -803,6 +806,14 @@
       "switchToGanttView": "Przełącz na widok Gantta",
       "switchToKanbanView": "Przełącz na widok Kanban",
       "switchToTableView": "Przełącz na widok tabeli"
+    },
+    "navigation": {
+      "title": "Nawigacja",
+      "overview": "Przejdź do przeglądu",
+      "upcoming": "Przejdź do nadchodzących zadań",
+      "namespaces": "Przejdź do sekcji i list",
+      "labels": "Przejdź do etykiet",
+      "teams": "Przejdź do zespołów"
     }
   },
   "update": {

src/i18n/lang/pt-BR.json

@@ -785,17 +785,20 @@
     "general": "General",
     "allPages": "These shortcuts work on all pages.",
     "currentPageOnly": "These shortcuts work only on the current page.",
+    "somePagesOnly": "These shortcuts work only on some pages.",
     "toggleMenu": "Toggle The Menu",
     "quickSearch": "Open the search/quick action bar",
     "then": "then",
     "task": {
       "title": "Task Page",
-      "done": "Done",
+      "done": "Mark task done / undone",
-      "assign": "Assign to a user",
+      "assign": "Assign this task to a user",
       "labels": "Add labels to this task",
       "dueDate": "Change the due date of this task",
       "attachment": "Add an attachment to this task",
-      "related": "Modify related tasks of this task"
+      "related": "Modify related tasks of this task",
+      "color": "Change the color of this task",
+      "move": "Move this task to another list"
     },
     "list": {
       "title": "List Views",
@@ -803,6 +806,14 @@
       "switchToGanttView": "Switch to gantt view",
       "switchToKanbanView": "Switch to kanban view",
       "switchToTableView": "Switch to table view"
+    },
+    "navigation": {
+      "title": "Navigation",
+      "overview": "Navigato to overview",
+      "upcoming": "Navigato to upcoming taks",
+      "namespaces": "Navigate to namepaces & lists",
+      "labels": "Navigate to labels",
+      "teams": "Navigate to teams"
     }
   },
   "update": {

src/i18n/lang/pt-PT.json

@@ -785,17 +785,20 @@
     "general": "Geral",
     "allPages": "Estes atalhos funcionam em todas as páginas.",
     "currentPageOnly": "Estes atalhos funcionamente apenas na página atual.",
+    "somePagesOnly": "Estes atalhos funcionam apenas em algumas páginas.",
     "toggleMenu": "Alternar o Menu",
     "quickSearch": "Abrir a pesquisa/barra de ação rápida",
     "then": "então",
     "task": {
       "title": "Página de Tarefa",
-      "done": "Concluído",
+      "done": "Marcar tarefa como concluída / não concluída",
-      "assign": "Atribuir a um utilizador",
+      "assign": "Atribuir esta tarefa a um utilizador",
       "labels": "Adicionar etiquetas a esta tarefa",
       "dueDate": "Alterar a data de vencimento desta tarefa",
       "attachment": "Adicionar um anexo a esta tarefa",
-      "related": "Modificar as tarefas relacionadas desta tarefa"
+      "related": "Modificar as tarefas relacionadas desta tarefa",
+      "color": "Alterar a cor desta tarefa",
+      "move": "Mover esta tarefa para outra lista"
     },
     "list": {
       "title": "Visualização em Lista",
@@ -803,6 +806,14 @@
       "switchToGanttView": "Alternar para visualização em gráfico de Gantt",
       "switchToKanbanView": "Alternar para visualização em método de Kanban",
       "switchToTableView": "Alternar para visualização em tabela"
+    },
+    "navigation": {
+      "title": "Navegação",
+      "overview": "Navegar para a vista geral",
+      "upcoming": "Navegar para próximas tarefas",
+      "namespaces": "Navegar para espaços e listas",
+      "labels": "Navegar para etiquetas",
+      "teams": "Navegar para equipas"
     }
   },
   "update": {

src/i18n/lang/ro-RO.json

@@ -785,17 +785,20 @@
     "general": "General",
     "allPages": "These shortcuts work on all pages.",
     "currentPageOnly": "These shortcuts work only on the current page.",
+    "somePagesOnly": "These shortcuts work only on some pages.",
     "toggleMenu": "Toggle The Menu",
     "quickSearch": "Open the search/quick action bar",
     "then": "then",
     "task": {
       "title": "Task Page",
-      "done": "Done",
+      "done": "Mark task done / undone",
-      "assign": "Assign to a user",
+      "assign": "Assign this task to a user",
       "labels": "Add labels to this task",
       "dueDate": "Change the due date of this task",
       "attachment": "Add an attachment to this task",
-      "related": "Modify related tasks of this task"
+      "related": "Modify related tasks of this task",
+      "color": "Change the color of this task",
+      "move": "Move this task to another list"
     },
     "list": {
       "title": "List Views",
@@ -803,6 +806,14 @@
       "switchToGanttView": "Switch to gantt view",
       "switchToKanbanView": "Switch to kanban view",
       "switchToTableView": "Switch to table view"
+    },
+    "navigation": {
+      "title": "Navigation",
+      "overview": "Navigato to overview",
+      "upcoming": "Navigato to upcoming taks",
+      "namespaces": "Navigate to namepaces & lists",
+      "labels": "Navigate to labels",
+      "teams": "Navigate to teams"
     }
   },
   "update": {

src/i18n/lang/ru-RU.json

@@ -785,17 +785,20 @@
     "general": "General",
     "allPages": "Работают на всех страницах.",
     "currentPageOnly": "Работают только на текущей странице.",
+    "somePagesOnly": "These shortcuts work only on some pages.",
     "toggleMenu": "Переключить меню",
     "quickSearch": "Открыть панель поиска/быстрых действий",
     "then": "then",
     "task": {
       "title": "Страница задачи",
-      "done": "Done",
+      "done": "Mark task done / undone",
-      "assign": "Assign to a user",
+      "assign": "Assign this task to a user",
       "labels": "Добавить метки этой задаче",
       "dueDate": "Изменить срок этой задачи",
       "attachment": "Добавить вложение к задаче",
-      "related": "Изменить связанные задачи"
+      "related": "Изменить связанные задачи",
+      "color": "Change the color of this task",
+      "move": "Move this task to another list"
     },
     "list": {
       "title": "List Views",
@@ -803,6 +806,14 @@
       "switchToGanttView": "Switch to gantt view",
       "switchToKanbanView": "Switch to kanban view",
       "switchToTableView": "Switch to table view"
+    },
+    "navigation": {
+      "title": "Navigation",
+      "overview": "Navigato to overview",
+      "upcoming": "Navigato to upcoming taks",
+      "namespaces": "Navigate to namepaces & lists",
+      "labels": "Navigate to labels",
+      "teams": "Navigate to teams"
     }
   },
   "update": {

src/i18n/lang/sv-SE.json

@@ -785,17 +785,20 @@
     "general": "General",
     "allPages": "These shortcuts work on all pages.",
     "currentPageOnly": "These shortcuts work only on the current page.",
+    "somePagesOnly": "These shortcuts work only on some pages.",
     "toggleMenu": "Toggle The Menu",
     "quickSearch": "Open the search/quick action bar",
     "then": "then",
     "task": {
       "title": "Task Page",
-      "done": "Done",
+      "done": "Mark task done / undone",
-      "assign": "Assign to a user",
+      "assign": "Assign this task to a user",
       "labels": "Add labels to this task",
       "dueDate": "Change the due date of this task",
       "attachment": "Add an attachment to this task",
-      "related": "Modify related tasks of this task"
+      "related": "Modify related tasks of this task",
+      "color": "Change the color of this task",
+      "move": "Move this task to another list"
     },
     "list": {
       "title": "List Views",
@@ -803,6 +806,14 @@
       "switchToGanttView": "Switch to gantt view",
       "switchToKanbanView": "Switch to kanban view",
       "switchToTableView": "Switch to table view"
+    },
+    "navigation": {
+      "title": "Navigation",
+      "overview": "Navigato to overview",
+      "upcoming": "Navigato to upcoming taks",
+      "namespaces": "Navigate to namepaces & lists",
+      "labels": "Navigate to labels",
+      "teams": "Navigate to teams"
     }
   },
   "update": {

src/i18n/lang/tr-TR.json

@@ -785,17 +785,20 @@
     "general": "General",
     "allPages": "These shortcuts work on all pages.",
     "currentPageOnly": "These shortcuts work only on the current page.",
+    "somePagesOnly": "These shortcuts work only on some pages.",
     "toggleMenu": "Toggle The Menu",
     "quickSearch": "Open the search/quick action bar",
     "then": "then",
     "task": {
       "title": "Task Page",
-      "done": "Done",
+      "done": "Mark task done / undone",
-      "assign": "Assign to a user",
+      "assign": "Assign this task to a user",
       "labels": "Add labels to this task",
       "dueDate": "Change the due date of this task",
       "attachment": "Add an attachment to this task",
-      "related": "Modify related tasks of this task"
+      "related": "Modify related tasks of this task",
+      "color": "Change the color of this task",
+      "move": "Move this task to another list"
     },
     "list": {
       "title": "List Views",
@@ -803,6 +806,14 @@
       "switchToGanttView": "Switch to gantt view",
       "switchToKanbanView": "Switch to kanban view",
       "switchToTableView": "Switch to table view"
+    },
+    "navigation": {
+      "title": "Navigation",
+      "overview": "Navigato to overview",
+      "upcoming": "Navigato to upcoming taks",
+      "namespaces": "Navigate to namepaces & lists",
+      "labels": "Navigate to labels",
+      "teams": "Navigate to teams"
     }
   },
   "update": {

src/i18n/lang/vi-VN.json

@@ -785,17 +785,20 @@
     "general": "Tổng quan",
     "allPages": "Các phím tắt này hoạt động ở mọi nơi.",
     "currentPageOnly": "Các phím tắt này chỉ hoạt động ở trang hiện tại.",
+    "somePagesOnly": "These shortcuts work only on some pages.",
     "toggleMenu": "Bật/tắt Menu",
     "quickSearch": "Mở thanh tìm kiếm/thao tác nhanh",
     "then": "sau đó",
     "task": {
       "title": "Trang công việc",
-      "done": "Done",
+      "done": "Mark task done / undone",
-      "assign": "Chỉ định một người",
+      "assign": "Assign this task to a user",
       "labels": "Thêm nhãn cho công việc này",
       "dueDate": "Thay đổi ngày hết hạn của công việc này",
       "attachment": "Thêm tệp đính kèm cho công việc này",
-      "related": "Sửa đổi các công việc liên kết"
+      "related": "Sửa đổi các công việc liên kết",
+      "color": "Change the color of this task",
+      "move": "Move this task to another list"
     },
     "list": {
       "title": "Xem danh sách",
@@ -803,6 +806,14 @@
       "switchToGanttView": "Chuyển sang biểu đồ Gantt",
       "switchToKanbanView": "Chuyển sang Kanban",
       "switchToTableView": "Chuyển qua xem Bảng"
+    },
+    "navigation": {
+      "title": "Navigation",
+      "overview": "Navigato to overview",
+      "upcoming": "Navigato to upcoming taks",
+      "namespaces": "Navigate to namepaces & lists",
+      "labels": "Navigate to labels",
+      "teams": "Navigate to teams"
     }
   },
   "update": {

src/styles/custom-properties/colors.scss

@@ -1,9 +1,182 @@
 // Vikunja colors as CSS custom properties
 
 :root {
+  // Core Bulma color variables
+  // Added (from bulma-css-variables/css/bulma.css) to fix issues with undefined variables
+  // This section should be removed once bulma/sass scoping issues are fixed
+  // see https://kolaente.dev/vikunja/frontend/issues/1064
+  // Variables overriden in Vikunja specific rules below are commented out
+  //--scheme-main: white;
+  --scheme-main-bis: #fafafa;
+  --scheme-main-ter: whitesmoke;
+  --scheme-invert: #0a0a0a;
+  --scheme-invert-rgb: 10.2, 10.2, 10.2;
+  --scheme-invert-bis: #121212;
+  --scheme-invert-ter: #242424;
+  --background: whitesmoke;
+  //--border: #dbdbdb;
+  --border-rgb: 219.3, 219.3, 219.3;
+  --border-hover: #b5b5b5;
+  --border-light: #ededed;
+  --border-light-hover: #b5b5b5;
+  --text: #4a4a4a;
+  --text-invert: #fff;
+  --text-light: #7a7a7a;
+  --text-strong: #363636;
+  --code: #da1039;
+  --code-background: var(--background, whitesmoke);
+  --pre: var(--text, #4a4a4a);
+  --pre-background: var(--background, whitesmoke);
+  --link-visited: #b86bff;
+  //--link-hover: #363636;
+  --link-hover-border: #b5b5b5;
+  --link-focus: #363636;
+  --link-focus-border: var(--link, #485fc7);
+  --link-active: #363636;
+  --link-active-border: #4a4a4a;
+  //--white-h: 0deg;
+  //--white-s: 0%;
+  //--white-l: 100%;
+  //--white-a: 1;
+  //--white: hsla(var(--white-h), var(--white-s), var(--white-l), var(--white-a));
+  --white-invert-l: 4%;
+  --white-invert: #0a0a0a;
+  --white-light-l: 100%;
+  --white-light: hsla(var(--white-h), var(--white-s), var(--white-light-l), var(--white-a));
+  --white-dark-l: 29%;
+  --white-dark: hsla(var(--white-h), var(--white-s), var(--white-dark-l), var(--white-a));
+  //--black-h: 0deg;
+  //--black-s: 0%;
+  //--black-l: 4%;
+  //--black-a: 1;
+  //--black: hsla(var(--black-h), var(--black-s), var(--black-l), var(--black-a));
+  --black-invert-l: 100%;
+  --black-invert: white;
+  --black-light-l: 96%;
+  --black-light: hsla(var(--black-h), var(--black-s), var(--black-light-l), var(--black-a));
+  --black-dark-l: 57%;
+  --black-dark: hsla(var(--black-h), var(--black-s), var(--black-dark-l), var(--black-a));
+  --light-h: 0deg;
+  --light-s: 0%;
+  --light-l: 96%;
+  --light-a: 1;
+  --light: hsla(var(--light-h), var(--light-s), var(--light-l), var(--light-a));
+  --light-invert-l: 0%;
+  --light-invert: rgba(0, 0, 0, 0.7);
+  --light-light-l: 96%;
+  --light-light: hsla(var(--light-h), var(--light-s), var(--light-light-l), var(--light-a));
+  --light-dark-l: 29%;
+  --light-dark: hsla(var(--light-h), var(--light-s), var(--light-dark-l), var(--light-a));
+  --dark-h: 0deg;
+  --dark-s: 0%;
+  --dark-l: 21%;
+  --dark-a: 1;
+  --dark: hsla(var(--dark-h), var(--dark-s), var(--dark-l), var(--dark-a));
+  --dark-invert-l: 100%;
+  --dark-invert: #fff;
+  --dark-light-l: 96%;
+  --dark-light: hsla(var(--dark-h), var(--dark-s), var(--dark-light-l), var(--dark-a));
+  --dark-dark-l: 54%;
+  --dark-dark: hsla(var(--dark-h), var(--dark-s), var(--dark-dark-l), var(--dark-a));
+  //--primary-h: 171deg;
+  //--primary-s: 100%;
+  //--primary-l: 41%;
+  //--primary-a: 1;
+  //--primary: hsla(var(--primary-h), var(--primary-s), var(--primary-l), var(--primary-a));
+  --primary-invert-l: 100%;
+  --primary-invert: #fff;
+  --primary-light-l: 96%;
+  --primary-light: hsla(var(--primary-h), var(--primary-s), var(--primary-light-l), var(--primary-a));
+  --primary-dark-l: 29%;
+  --primary-dark: hsla(var(--primary-h), var(--primary-s), var(--primary-dark-l), var(--primary-a));
+  --link-h: 229deg;
+  --link-s: 53%;
+  --link-l: 53%;
+  --link-a: 1;
+  //--link: hsla(var(--link-h), var(--link-s), var(--link-l), var(--link-a));
+  --link-invert-l: 100%;
+  --link-invert: #fff;
+  --link-light-l: 96%;
+  --link-light: hsla(var(--link-h), var(--link-s), var(--link-light-l), var(--link-a));
+  --link-dark-l: 47%;
+  --link-dark: hsla(var(--link-h), var(--link-s), var(--link-dark-l), var(--link-a));
+  --info-h: 207deg;
+  --info-s: 61%;
+  --info-l: 53%;
+  --info-a: 1;
+  --info: hsla(var(--info-h), var(--info-s), var(--info-l), var(--info-a));
+  --info-invert-l: 100%;
+  --info-invert: #fff;
+  --info-light-l: 96%;
+  --info-light: hsla(var(--info-h), var(--info-s), var(--info-light-l), var(--info-a));
+  --info-dark-l: 41%;
+  --info-dark: hsla(var(--info-h), var(--info-s), var(--info-dark-l), var(--info-a));
+  //--success-h: 153deg;
+  //--success-s: 53%;
+  //--success-l: 53%;
+  //--success-a: 1;
+  //--success: hsla(var(--success-h), var(--success-s), var(--success-l), var(--success-a));
+  --success-invert-l: 100%;
+  --success-invert: #fff;
+  --success-light-l: 96%;
+  --success-light: hsla(var(--success-h), var(--success-s), var(--success-light-l), var(--success-a));
+  --success-dark-l: 31%;
+  --success-dark: hsla(var(--success-h), var(--success-s), var(--success-dark-l), var(--success-a));
+  //--warning-h: 44deg;
+  //--warning-s: 100%;
+  //--warning-l: 77%;
+  //--warning-a: 1;
+  //--warning: hsla(var(--warning-h), var(--warning-s), var(--warning-l), var(--warning-a));
+  --warning-invert-l: 0%;
+  --warning-invert: rgba(0, 0, 0, 0.7);
+  --warning-light-l: 96%;
+  --warning-light: hsla(var(--warning-h), var(--warning-s), var(--warning-light-l), var(--warning-a));
+  --warning-dark-l: 29%;
+  --warning-dark: hsla(var(--warning-h), var(--warning-s), var(--warning-dark-l), var(--warning-a));
+  //--danger-h: 348deg;
+  //--danger-s: 86%;
+  //--danger-l: 61%;
+  //--danger-a: 1;
+  //--danger: hsla(var(--danger-h), var(--danger-s), var(--danger-l), var(--danger-a));
+  --danger-invert-l: 100%;
+  --danger-invert: #fff;
+  --danger-light-l: 96%;
+  --danger-light: hsla(var(--danger-h), var(--danger-s), var(--danger-light-l), var(--danger-a));
+  --danger-dark-l: 43%;
+  --danger-dark: hsla(var(--danger-h), var(--danger-s), var(--danger-dark-l), var(--danger-a));
+  --input-color: var(--text-strong, #363636);
+  --input-background-color: var(--scheme-main, white);
+  //--input-border-color: var(--border, #dbdbdb);
+  --input-shadow: inset 0 0.0625em 0.125em rgba(var(--scheme-invert-rgb, 10.2, 10.2, 10.2), 0.05);
+  --input-placeholder-color: rgba(54, 54, 54, 0.3);
+  --input-hover-color: var(--text-strong, #363636);
+  --input-hover-border-color: var(--border-hover, #b5b5b5);
+  --input-focus-color: var(--text-strong, #363636);
+  --input-focus-border-color: var(--link, #485fc7);
+  --input-focus-box-shadow-color: var(--input-focus-box-shadow-color-hsla, rgba(72, 95, 199, 0.25));
+  --input-disabled-color: var(--text-light, #7a7a7a);
+  //--input-disabled-background-color: var(--background, whitesmoke);
+  //--input-disabled-border-color: var(--background, whitesmoke);
+  --input-disabled-placeholder-color: rgba(122, 122, 122, 0.3);
+  --input-arrow: var(--link, #485fc7);
+  --input-icon-color: var(--border, #dbdbdb);
+  --input-icon-active-color: var(--text, #4a4a4a);
+  --black-bis: #121212;
+  --black-ter: #242424;
+  //--grey-darker: #363636;
+  //--grey-dark: #4a4a4a;
+  //--grey: #7a7a7a;
+  //--grey-light: #b5b5b5;
+  //--grey-lighter: #dbdbdb;
+  --white-ter: whitesmoke;
+  --white-bis: #fafafa;
+// END core Bulma color variables
+
+
   // Vikunja specific variables
   --grey-50: hsl(210, 20%, 98%);
-  --grey-100: hsl(220, 14.3%, 95.9%);
+  --grey-100-hsl: 220, 14.3%, 95.9%;
+  --grey-100: hsl(var(--grey-100-hsl));
   --grey-200: hsl(220, 13%, 91%);
   --grey-300: hsl(216, 12.2%, 83.9%);
   --grey-400: hsl(217.9, 10.6%, 64.9%);
@@ -14,9 +187,9 @@
   --grey-800: hsl(215, 27.9%, 16.9%);
   --grey-900: hsl(220.9, 39.3%, 11%);
   --site-background: var(--grey-100);
-  --scheme-main: var(--white);
 
   // Overrides of Bulma defaults
+  --scheme-main: var(--white);
   --grey-darker: var(--grey-700);
   --grey-dark:  var(--grey-800);
   --grey:  var(--grey-500);
@@ -66,6 +239,12 @@
   --primary-a: 1;
   --primary-hsl: var(--primary-h), var(--primary-s), var(--primary-l);
   --primary: hsla(var(--primary-h), var(--primary-s), var(--primary-l), var(--primary-a));
+
+  --link: var(--primary);
+  --link-hover: hsla(var(--primary-h), var(--primary-s), var(--primary-l), .75);
+  --border: var(--grey-200);
+  --input-disabled-background-color: var(--grey-100);
+  --input-disabled-border-color: var(--grey-300);
   // END Overrides of Bulma defaults
 
 
@@ -76,12 +255,6 @@
   --card-border-color: var(--grey-200);
   --logo-text-color: hsl(180, 1%, 15%);
 
-  --link: var(--primary);
-  --link-hover: hsla(var(--primary-h), var(--primary-s), var(--primary-l), .75);
-  --border: var(--grey-200);
-  --input-disabled-background-color: var(--grey-100);
-  --input-disabled-border-color: var(--grey-300);
-
   &.dark {
     // Light mode colours reversed for dark mode
     --grey-900-hsl: 210, 20%, 98%;

src/sw.js

@@ -1,7 +1,7 @@
 /* eslint-disable no-console */
 /* eslint-disable no-undef */
 
-const workboxVersion = 'v6.5.0'
+const workboxVersion = 'v6.5.2'
 importScripts( `/workbox-${workboxVersion}/workbox-sw.js`)
 workbox.setConfig({
 	modulePathPrefix: `/workbox-${workboxVersion}`,

src/views/list/ListKanban.vue

@@ -654,10 +654,6 @@ $filter-container-height: '1rem - #{$switch-view-height}';
 		}
 	}
 
-	.sortable-chosen .task {
-		transform: rotate(3deg);
-	}
-
 	.bucket {
 		border-radius: $radius;
 		position: relative;

src/views/list/ListWrapper.vue

@@ -42,12 +42,12 @@
 			</Message>
 		</transition>
 
-		<slot />
+		<slot v-if="loadedListId"/>
 	</div>
 </template>
 
 <script setup lang="ts">
-import {ref, shallowRef, computed, watchEffect} from 'vue'
+import {ref, computed, watchEffect} from 'vue'
 import {useRoute} from 'vue-router'
 
 import Message from '@/components/misc/message.vue'
@@ -55,12 +55,12 @@ import Message from '@/components/misc/message.vue'
 import ListModel from '@/models/list'
 import ListService from '@/services/list'
 
-import {store} from '@/store'
+import {BACKGROUND, CURRENT_LIST} from '@/store/mutation-types'
-import {CURRENT_LIST} from '@/store/mutation-types'
 
 import {getListTitle} from '@/helpers/getListTitle'
 import {saveListToHistory} from '@/modules/listHistory'
-import { useTitle } from '@/composables/useTitle'
+import {useTitle} from '@/composables/useTitle'
+import {useStore} from 'vuex'
 
 const props = defineProps({
 	listId: {
@@ -74,8 +74,9 @@ const props = defineProps({
 })
 
 const route = useRoute()
+const store = useStore()
 
-const listService = shallowRef(new ListService())
+const listService = ref(new ListService())
 const loadedListId = ref(0)
 
 const currentList = computed(() => {
@@ -87,7 +88,7 @@ const currentList = computed(() => {
 	} : store.state.currentList
 })
 
-// call again the method if the listId changes
+// call the method again if the listId changes
 watchEffect(() => loadList(props.listId))
 
 useTitle(() => currentList.value.id ? getListTitle(currentList.value) : '')
@@ -123,6 +124,14 @@ async function loadList(listIdToLoad: number) {
 
 	console.debug(`Loading list, props.viewName = ${props.viewName}, $route.params =`, route.params, `, loadedListId = ${loadedListId.value}, currentList = `, currentList.value)
 
+	// Put set the current list to the one we're about to load so that the title is already shown at the top
+	loadedListId.value = 0
+	const listFromStore = store.getters['lists/getListById'](listData.id)
+	if (listFromStore !== null) {
+		store.commit(BACKGROUND, null)
+		store.commit(CURRENT_LIST, listFromStore)
+	}
+
 	// We create an extra list object instead of creating it in list.value because that would trigger a ui update which would result in bad ux.
 	const list = new ListModel(listData)
 	try {

src/views/tasks/TaskDetailView.vue

@@ -259,6 +259,7 @@
 							class="is-outlined has-no-border"
 							icon="check-double"
 							variant="secondary"
+							v-shortcut="'t'"
 						>
 							{{ task.done ? $t('task.detail.undone') : $t('task.detail.done') }}
 						</x-button>
@@ -356,6 +357,7 @@
 							@click="setFieldActive('moveList')"
 							variant="secondary"
 							icon="list"
+							v-shortcut="'m'"
 						>
 							{{ $t('task.detail.actions.moveList') }}
 						</x-button>
@@ -363,6 +365,7 @@
 							@click="setFieldActive('color')"
 							variant="secondary"
 							icon="fill-drip"
+							v-shortcut="'c'"
 						>
 							{{ $t('task.detail.actions.color') }}
 						</x-button>