The Graph is everywhere

frontend/src/Editor.svelte

@@ -68,6 +68,8 @@
   .right {
     width: 40vw;
     height: 100%;
+    z-index: 20;
+    position: relative;
   }
 
   .left {
@@ -111,7 +113,7 @@
     <div class="toolbox">
       <div>Toolbox</div>
       <div>
-        <button on:click={addEdge}>Pridat hranu - posledni vyzaduje predposledni</button>
+        <button disabled={clicked.length <= 1} on:click={addEdge}>Přidat hranu {clicked[clicked.length - 2]} -&gt; {clicked[clicked.length - 1]}</button>
       </div>
       <div><button on:click={graph.runSimulation}>Spustit simulaci</button></div>
       <div>

frontend/src/Graph.svelte

@@ -98,8 +98,22 @@
 
 <style>
   div {
+    width: 100vw;
+    height: 100vh;
+    position: fixed;
+    top: 0px;
+    left: 0px;
+  }
+  :global(#header) {
+    z-index: 20
+  }
+  :global(#wrapper) {
+    display: flex;
+    flex-direction: column;
     height: 100%;
-    width: 100%;
+  }
+  :global(#page) {
+    flex-grow: 1;
   }
 </style>
 

frontend/src/TaskPanel.svelte

@@ -32,7 +32,7 @@ import TaskDisplay from "./TaskDisplay.svelte";
 
 <style>
     .panel {
-        position: absolute;
+        position: relative;
         width: 100%;
         background-color: #222;
         overflow: hidden;