From f4748f7d9e79a483b8c19098c3035ac5a0b27c69 Mon Sep 17 00:00:00 2001
From: David Mosbach <david.mosbach@live.de>
Date: Mon, 22 May 2023 21:50:09 +0200
Subject: [PATCH] visually separated menu from canvas

---
 editor.html | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)
diff --git a/editor.html b/editor.html
index 3cefe64..4d96b96 100644
--- a/editor.html
+++ b/editor.html
@@ -8,14 +8,15 @@
   <!--<script src="../../dist/force-graph.js"></script>-->
 </head>
 
-<body>
+<body style="margin: 0 0 0 0;">
   <div id="editor">
     <!-- <br/>
     <div style="text-align: center; color: silver">
       <b>New node:</b> click on the canvas, <b>New link:</b> drag one node close enough to another one,
       <b>Rename</b> node or link by clicking on it, <b>Remove</b> node or link by right-clicking on it
     </div> -->
-    <div id="settings">
+    <div id="settings" style="line-height: 2; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); top: 0px;
+                              width: 100%; position: fixed; padding: 8 8 8 8; background-color: rgb(230, 230, 230); z-index: 2;">
       <label for="actor">Highlight actor: </label>
       <select name="actor" id="actor" onchange="selectActor();"></select>
     </div>
