Removed live indicator + began to write graphics menu

client/components/menu_popup/menu_popup.css

@@ -0,0 +1,33 @@
+#menu{
+    width: 300px;
+    height: 200px;
+    background-color: white;
+    position: absolute;
+    top: 28px;
+    right: 50%;
+    z-index: 1;
+    border: 2px solid black;
+}
+
+#menu_title_container{
+    display: flex;
+    width: 100%;
+    height: 20px;
+}
+
+#menu_title_container span{
+    margin-top: auto;
+    margin-bottom: auto;
+    margin-left: 5px;
+    
+}
+
+#menu-popup-close{
+    margin-left: auto;
+    margin-right: 2px;
+    margin-top: auto;
+    margin-bottom: auto;
+    height: 15px;
+    width: 15px;
+    cursor: pointer;
+}

client/components/menu_popup/menu_popup.js

@@ -0,0 +1,42 @@
+class MenuPopup extends HTMLElement{
+    constructor(){
+        super();
+    }
+
+    hide(){
+        this.style.visibility = "hidden";
+    }
+
+    show(){
+        this.style.visibility = "visible";
+    }
+
+    connectedCallback(){
+        this.render();        
+        this.hide();
+        document.getElementById("menu-popup-close").onclick = () => {this.hide()};
+    }
+
+    render(){
+        this.innerHTML = `
+        <div id="menu">
+            <div id="menu_title_container">
+                <span>Menu</span>
+                <img src="res/close.png" id="menu-popup-close">
+            </div>
+        </div>
+        `;
+        let cursorDescription = `
+            To remove the cursor, you can double click on any graph.
+        `
+        let menuContainer = document.getElementById("menu");      
+        
+        menuContainer.appendChild(new HorizontalDivider());
+
+        let cursorHelp = new HelpEntry("How to remove the cursor", cursorDescription);
+
+        menuContainer.appendChild(cursorHelp);
+    }
+}
+
+customElements.define("sea-menu", MenuPopup);