fix context panel

src/editor/Editor.js

@@ -652,7 +652,7 @@ class Editor extends EditorStartup {
     if (context) {
       let str = '';
       linkStr = '<a href="#" data-root="y">' + this.svgCanvas.getCurrentDrawing().getCurrentLayerName() + '</a>';
-      const parentsUntil = getParentsUntil(context, '#svgcontent > g');
+      const parentsUntil = getParentsUntil(context, '#svgcontent');
       parentsUntil.forEach(function (parent) {
         if (parent.id) {
           str += ' > ' + parent.id;

src/editor/EditorStartup.js

@@ -140,20 +140,18 @@ class EditorStartup {
     this.selectedElement = null;
     this.multiselected = false;
 
-    const aLinks = $id('cur_context_panel').querySelectorAll('a');
+    const aLink = $id('cur_context_panel');
 
-    for (const aLink of aLinks) {
-      aLink.addEventListener('click', (evt) => {
-        const link = evt.currentTarget;
-        if (link.hasAttribute('data-root')) {
-          this.svgCanvas.leaveContext();
-        } else {
-          this.svgCanvas.setContext(link.textContent);
-        }
-        this.svgCanvas.clearSelection();
-        return false;
-      });
-    }
+    aLink.addEventListener('click', (evt) => {
+      const link = evt.target;
+      if (link.hasAttribute('data-root')) {
+        this.svgCanvas.leaveContext();
+      } else {
+        this.svgCanvas.setContext(link.textContent);
+      }
+      this.svgCanvas.clearSelection();
+      return false;
+    });
 
     // bind the selected event to our function that handles updates to the UI
     this.svgCanvas.bind('selected', this.selectedChanged.bind(this));

src/editor/svgedit.css

@@ -1,6 +1,6 @@
 :root {
   --main-bg-color: #72797A;
-  --text-color: #ffffff;
+  --text-color: #000000;
   --border-color: #808080;
   --canvas-bg-color: #B2B2B2;
   --link-color: #19c;
@@ -384,17 +384,13 @@ hr {
 }
 
 #cur_context_panel {
-  position: absolute;
-  top: 57px;
-  left: 56px;
+  grid-area: rulerX;
   line-height: 22px;
   overflow: auto;
   padding-left: 5px;
   font-size: 12px;
   background: rgba(0, 0, 0, 0.8);
   color: #ccc;
-  padding: 0 10px;
-  border-radius: 0 0 3px 0;
 }
 
 #cur_context_panel a {