diff --git a/frontend/src/App.svelte b/frontend/src/App.svelte
index fb14b56..b2541f4 100644
--- a/frontend/src/App.svelte
+++ b/frontend/src/App.svelte
@@ -39,7 +39,8 @@
         <div style="height: 100%">
           <Graph
             tasks={t}
-            on:selectTask={(e) => { if (e.detail.type != "label") (location.hash = `#task/${e.detail.id}`)}}/>
+            on:selectTask={(e) => { if (e.detail.type != "label") (location.hash = `#task/${e.detail.id}`)}}
+            on:closeTask={() => {location.hash = '#'}} />
         </div>
       </TasksLoader>
     {/if}
diff --git a/frontend/src/Graph.svelte b/frontend/src/Graph.svelte
index 6d535b6..448a5e8 100644
--- a/frontend/src/Graph.svelte
+++ b/frontend/src/Graph.svelte
@@ -81,6 +81,10 @@ import TaskDetailEditor from "./TaskDetailEditor.svelte";
     d3.select(container).call(zoomer);
   }
 
+  function containerClickHandler(e: MouseEvent) {
+    eventDispatcher("closeTask");
+  }
+
   function groupSelectionHandler(e: MouseEvent) {
     // not enabled?
     if (!selectionToolEnabled) return;
@@ -271,6 +275,7 @@ import TaskDetailEditor from "./TaskDetailEditor.svelte";
   bind:this={container}
   bind:clientHeight
   bind:clientWidth
+  on:click={containerClickHandler}
   on:mousedown={groupSelectionHandler}
   on:contextmenu={(e) => {
     if (selectionToolEnabled) {
diff --git a/frontend/src/GraphNode.svelte b/frontend/src/GraphNode.svelte
index 58fc0bf..62056be 100644
--- a/frontend/src/GraphNode.svelte
+++ b/frontend/src/GraphNode.svelte
@@ -25,6 +25,7 @@
   }
 
   function click(e: MouseEvent) {
+    e.stopPropagation();
     eventDispatcher("click", e);
   }