From 3cd8bb4f76ab2f9d03000028f5a761696ae614b8 Mon Sep 17 00:00:00 2001
From: Andy Bunce <bunce.andy@gmail.com>
Date: Mon, 20 Oct 2025 16:49:09 +0100
Subject: [PATCH] [fix] css

---
 webapp/static/clients/codemirror/grail.css     | 10 ++++++++--
 webapp/static/clients/codemirror/grail.html    |  2 +-
 webapp/static/clients/codemirror/wc-qd-list.js |  4 ++--
 3 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/webapp/static/clients/codemirror/grail.css b/webapp/static/clients/codemirror/grail.css
index 96f37fe..5988d4a 100644
--- a/webapp/static/clients/codemirror/grail.css
+++ b/webapp/static/clients/codemirror/grail.css
@@ -69,9 +69,10 @@ details[open]::details-content {
   border: thin solid grey;
   overflow:auto;
 }
-  ::backdrop {
+
+::backdrop {
     backdrop-filter: blur(2px);
-  }
+}
 
   @media (max-width: 600px) {
     grid-template-columns: 100%;
@@ -95,6 +96,11 @@ details[open]::details-content {
   grid-row: 2 / 4;
   display: flex;
   flex-direction: column;
+  details {
+    display: flex;
+    flex-direction: column;
+    
+  }
 }
 
 .page-nav {
diff --git a/webapp/static/clients/codemirror/grail.html b/webapp/static/clients/codemirror/grail.html
index f37f13e..5aa0c85 100644
--- a/webapp/static/clients/codemirror/grail.html
+++ b/webapp/static/clients/codemirror/grail.html
@@ -132,7 +132,7 @@
 
             <details id="symPanel">
                 <summary>OutLine <b>0</b></summary>
-                <qd-list id="symList"></qd-list>
+                <qd-list id="symList" style="flex-grow:1;"></qd-list>
             </details>
 
             <details id="msgPanel">
diff --git a/webapp/static/clients/codemirror/wc-qd-list.js b/webapp/static/clients/codemirror/wc-qd-list.js
index 3a3b76b..ecdd393 100644
--- a/webapp/static/clients/codemirror/wc-qd-list.js
+++ b/webapp/static/clients/codemirror/wc-qd-list.js
@@ -117,7 +117,7 @@ class PanelComponent extends HTMLElement {
     /* Render the list items #data */
     render() {
         const list = document.createElement('ul');
-        list.style = "max-height:45cqh;overflow: auto;";
+        list.style = "overflow: auto;";
 
         const select = e => {
             if(e.type ==="keyup" && !(e.key==="Enter" )) return;
@@ -148,7 +148,7 @@ class PanelComponent 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;overflow: auto; 
+      ul { list-style-type: none; padding:0;margin:0; 
       background-color: #f8f9fa;font-size: 80%;}
       li { padding: 0 0 0 2px; border-bottom: 1px solid #ccc; cursor: pointer; width:100%; }
       li:not(.selected) :hover { background-color:  #ccc; }