Add ESC handling

frontend/src/QuizCard.svelte

@@ -13,16 +13,17 @@
     padding: 20px;
     color: #fff;
     font-family: Arial, sans-serif;
-    width: 300px;
+/*    width: 300px;*/
     margin: 10px;
+    padding: 10px;
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
   }
 
   .card:hover {
     background-color: #444;
     cursor: pointer;
-    transform: scale(1.05);
-    transition: all 0.3s ease;
+    /* transform: scale(1.05); */
+    /* transition: all 0.3s ease; */
   }
   
   .question {

frontend/src/QuizCardList.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import { onMount } from "svelte";
   import CodeMirror from "svelte-codemirror-editor";
   import { markdown } from "@codemirror/lang-markdown";
   import QuizCard from "./QuizCard.svelte";
@@ -10,7 +11,14 @@
   let value: string;
   let editingIndex: number;
 
-  function editQuiz(quiz: Quiz, index: number) {
+  onMount(() => {
+    document.addEventListener("keydown", handleKeydown);
+    return () => {
+      document.removeEventListener("keydown", handleKeydown);
+    };
+  });
+  
+  function editQuiz(quiz: main.Quiz, index: number) {
     Markdown(quiz).then(
       (result) => {
 	value = result;
@@ -28,6 +36,11 @@
     editingIndex = -1;
   }
 
+  function handleKeydown(event: KeyboardEvent) {
+    if (event.key === "Escape" && editingIndex !== -1) {
+      editingIndex = -1;
+    }
+  }
 </script>
 
 <div>