diff --git a/webapp/static/clients/codemirror/grail.html b/webapp/static/clients/codemirror/grail.html
index 8b6581a..a174fb9 100644
--- a/webapp/static/clients/codemirror/grail.html
+++ b/webapp/static/clients/codemirror/grail.html
@@ -166,21 +166,6 @@
         </form>
     </dialog>
 
- <dialog id="popHelp" popover>
-        <form>
-            <header>Help
-                <button type="button" class="btn-close"  aria-label="Close"
-                 onclick="$('popHelp').hidePopover(); "></button>
-            </header>
-            <div id=popHelpInfo" class="modal-body">
-                TODO
-            </div>
-            <div class="modal-footer">
-                
-            </div>
-        </form>
-    </dialog>
-
     <!--  <popup-info id="popHelp">hhhh</popup-info> -->
 
     <dialog id="popSettings" popover>
diff --git a/webapp/static/clients/codemirror/list.js b/webapp/static/clients/codemirror/list.js
index cb1254f..8bafc46 100644
--- a/webapp/static/clients/codemirror/list.js
+++ b/webapp/static/clients/codemirror/list.js
@@ -30,45 +30,29 @@ class ListComponent extends HTMLElement {
     get data() {
         return this.#data;
     }
-    select(e) {
-        this.#shadow.querySelectorAll('li.selected').forEach(item => { item.className = ''; });
-        e.currentTarget.className = 'selected';
-        console.log('Item clicked:', item, listItem);
-        // You can dispatch a custom event here if needed.
-        this.dispatchEvent(new CustomEvent('itemSelected', {
-            detail: item,
-            bubbles: true,
-            composed: true
-        }));
 
-    }
     /* Render the list items #data */
     render() {
         const list = document.createElement('ul');
         list.style = "max-height:80cqh;overflow: auto;";
-
-        const select = e => {
-            if(e.type ==="keyup" && !(e.key==="Enter" )) return;
-            this.#shadow.querySelectorAll('li.selected').forEach(item => { item.className = ''; });
-            e.currentTarget.className = 'selected';
-            const i=e.currentTarget.getAttribute("data-index")
-            console.log('Item index clicked:', i);
-            // You can dispatch a custom event here if needed.
-            this.dispatchEvent(new CustomEvent('itemSelected', {
-                detail: i,
-                bubbles: true,
-                composed: true
-            }));
-        };
+        const shad = this.#shadow;
         this.#data.forEach((item, index) => {
             const listItem = document.createElement('li');
-            listItem.setAttribute("tabindex", "0")
-            listItem.setAttribute("data-index", index)
-            listItem.innerHTML = `<i  class='codicon codicon-${this.#iconKinds[item.kind]}'></i>
-            <span >${item.name} - ${item.detail}</span>`;
+            listItem.innerHTML = `<a href="#"><i  class='codicon codicon-${this.#iconKinds[item.kind]}'></i>
+            <span>${item.name} - ${item.detail}</span></a>`;
 
-            listItem.addEventListener('click', select);
-             listItem.addEventListener('keyup', select);
+            listItem.addEventListener('click', function (e) {
+                shad.querySelectorAll('li.selected').forEach(item => { item.className = ''; });
+                e.currentTarget.className = 'selected';
+
+                console.log('Item clicked:', item, listItem);
+                // You can dispatch a custom event here if needed.
+                this.dispatchEvent(new CustomEvent('itemSelected', {
+                    detail: item,
+                    bubbles: true,
+                    composed: true
+                }));
+            });
             list.appendChild(listItem);
         });
 
@@ -76,10 +60,10 @@ class ListComponent extends HTMLElement {
         const style = document.createElement('style');
         style.textContent = `
       @import url("../codicon@0.0.40/codicon.css");  
-      ul { list-style-type: none; padding:0;margin:0; }
-      li { padding: 0 0 0 2px; border-bottom: 1px solid #ccc; cursor: pointer; width:100%; }
-      li:not(.selected) :hover { background-color:  #ccc; }
-      .selected {  background-color: #0d6efd;color: #ffff;}
+      ul { list-style-type: none; padding: 0; margin: 0; }
+      li { padding: 1px; border-bottom: 1px solid #ccc; cursor: pointer; }
+      li :not(.selected) :hover { background:  #ccc; }
+      .selected {  background: lightgreen;}
       i {vertical-align: middle;}
     `;
         this.#shadow.appendChild(style);