[fix] css

This commit is contained in:
Andy Bunce 2025-10-20 16:49:09 +01:00
parent be12f0200c
commit 3cd8bb4f76
3 changed files with 11 additions and 5 deletions

View file

@ -69,9 +69,10 @@ details[open]::details-content {
border: thin solid grey; border: thin solid grey;
overflow:auto; overflow:auto;
} }
::backdrop {
::backdrop {
backdrop-filter: blur(2px); backdrop-filter: blur(2px);
} }
@media (max-width: 600px) { @media (max-width: 600px) {
grid-template-columns: 100%; grid-template-columns: 100%;
@ -95,6 +96,11 @@ details[open]::details-content {
grid-row: 2 / 4; grid-row: 2 / 4;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
details {
display: flex;
flex-direction: column;
}
} }
.page-nav { .page-nav {

View file

@ -132,7 +132,7 @@
<details id="symPanel"> <details id="symPanel">
<summary>OutLine <b>0</b></summary> <summary>OutLine <b>0</b></summary>
<qd-list id="symList"></qd-list> <qd-list id="symList" style="flex-grow:1;"></qd-list>
</details> </details>
<details id="msgPanel"> <details id="msgPanel">

View file

@ -117,7 +117,7 @@ class PanelComponent extends HTMLElement {
/* Render the list items #data */ /* Render the list items #data */
render() { render() {
const list = document.createElement('ul'); const list = document.createElement('ul');
list.style = "max-height:45cqh;overflow: auto;"; list.style = "overflow: auto;";
const select = e => { const select = e => {
if(e.type ==="keyup" && !(e.key==="Enter" )) return; if(e.type ==="keyup" && !(e.key==="Enter" )) return;
@ -148,7 +148,7 @@ class PanelComponent extends HTMLElement {
const style = document.createElement('style'); const style = document.createElement('style');
style.textContent = ` style.textContent = `
@import url("../codicon@0.0.40/codicon.css"); @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%;} background-color: #f8f9fa;font-size: 80%;}
li { padding: 0 0 0 2px; border-bottom: 1px solid #ccc; cursor: pointer; width:100%; } li { padding: 0 0 0 2px; border-bottom: 1px solid #ccc; cursor: pointer; width:100%; }
li:not(.selected) :hover { background-color: #ccc; } li:not(.selected) :hover { background-color: #ccc; }