feat: close modals with esc key (#741)

Co-authored-by: Dominik Pschenitschni <mail@celement.de>
Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/741
Reviewed-by: konrad <k@knt.li>
Co-authored-by: dpschen <dpschen@noreply.kolaente.de>
Co-committed-by: dpschen <dpschen@noreply.kolaente.de>

src/views/About.vue

@@ -1,7 +1,12 @@
 <template>
 	<transition name="fade">
 		<div class="modal-mask hint-modal">
-			<div @click.self="$router.back()" class="modal-container">
+			<div
+				class="modal-container"
+				@click.self="$router.back()"
+				@shortkey="$router.back()"
+				v-shortkey="['esc']"
+			>
 				<div class="modal-content">
 					<card
 						class="has-background-white has-no-shadow"

src/views/filters/CreateSavedFilter.vue

@@ -1,6 +1,11 @@
 <template>
 	<div class="modal-mask hint-modal">
-		<div @click.self="$router.back()" class="modal-container">
+		<div
+			class="modal-container"
+			@click.self="$router.back()"
+			@shortkey="$router.back()"
+			v-shortkey="['esc']"
+		>
 			<div class="modal-content">
 				<card class="has-background-white has-no-shadow" :title="$t('filters.create.title')">
 					<p>

src/views/tasks/TaskDetailViewModal.vue

@@ -1,6 +1,11 @@
 <template>
 	<div class="modal-mask">
-		<div @mousedown.self="close()" class="modal-container">
+		<div
+			class="modal-container"
+			@mousedown.self="close()"
+			v-shortkey="['esc']"
+			@shortkey="close()"
+		>
 			<div class="scrolling-content">
 				<a @click="close()" class="close">
 					<icon icon="times"/>