quodatum/basex-lsp
1
0
Fork 0
Code Issues 14 Activity Actions

[mod] css

Browse source
This commit is contained in:
Andy Bunce 2025-10-31 23:06:43 +00:00
parent 559828340e
commit 4bfb36e4e0
5 changed files with 48 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
webapp/lsp/position.xqm
View file

@ -91,7 +91,7 @@ declare function pos:range-from-ast(
$text as xs:string) $text as xs:string)
as lspt:Range{ as lspt:Range{
lspt:Range( lspt:Range(
pos:toPosition($text,number($ast/@start)), pos:toPosition($text,number($ast/@start)-1),
pos:toPosition($text, number($ast/@end)) pos:toPosition($text, number($ast/@end))
) )
}; };

38
webapp/static/clients/codemirror/grail.css
View file

@ -2,18 +2,26 @@
:root { :root {
color-scheme: light dark; color-scheme: light dark;
--quiet-primary-seed: #e98d61;
--quiet-content-spacing: 0.75rem;
} }
* { * {
box-sizing: border-box; box-sizing: border-box;
} }
html {
height: 100%;
}
body { body {
background: #e4e4e4; background: #e4e4e4;
padding: 0; padding: 0;
height: 100vh; height: 100vh;
min-height: 100vh;
margin: 0; margin: 0;
} }
form header { form header {
background-color: burlywood; background-color: burlywood;
} }
@ -26,7 +34,6 @@ form header {
display: grid; display: grid;
grid-template-columns: minmax(10px, 1fr) minmax(10px, 4fr); grid-template-columns: minmax(10px, 1fr) minmax(10px, 4fr);
grid-template-rows: min-content min-content 1fr min-content; grid-template-rows: min-content min-content 1fr min-content;
gap: 1px;
.navbar * { .navbar * {
@ -34,19 +41,16 @@ form header {
} }
details { details {
padding:2px;
padding-left: 3px;
} }
details[open] { details[open] {
flex-grow: 1; flex-grow: 1;
overflow:hidden; overflow: hidden;
} }
summary { summary {
/* class: bg-info; */ background-color: var(--quiet-neutral-fill-softer);
--bs-bg-opacity: 1;
background-color: rgba(var(--bs-light-rgb),var(--bs-bg-opacity)) !important;
} }
/* Set editor dimensions */ /* Set editor dimensions */
@ -63,15 +67,15 @@ form header {
overflow: auto; overflow: auto;
} }
details[open]::details-content { details[open]::details-content {
padding: 0.1em; padding: 0.1em;
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%;
@ -83,15 +87,16 @@ details[open]::details-content {
} }
} }
} }
#tConnect:state(unchecked) {
#tConnect:state(unchecked) {
outline: dashed 4px deeppink; outline: dashed 4px deeppink;
outline-offset: 4px; outline-offset: 4px;
} }
.page-header { .page-header {
grid-column: 1 / -1; grid-column: 1 / -1;
display:flex; display: flex;
justify-content:space-between; justify-content: space-between;
} }
.page-sidebar { .page-sidebar {
@ -99,6 +104,7 @@ details[open]::details-content {
grid-row: 2 / 4; grid-row: 2 / 4;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
details { details {
display: flex; display: flex;
flex-direction: column; flex-direction: column;

26
webapp/static/clients/codemirror/grail.html
View file

@ -1,5 +1,5 @@
<!doctype html> <!doctype html>
<html lang="en" class="quiet-cloak "> <!-- also quiet-dark --> <html lang="en" class="quiet-cloak quiet-blue"> <!-- also quiet-dark -->
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
@ -11,9 +11,9 @@
<!-- Default theme (if not already installed) --> <!-- Default theme (if not already installed) -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@quietui/quiet-browser@1.6.1/dist/themes/quiet.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@quietui/quiet-browser@1.6.1/dist/themes/quiet.css">
<!-- Quiet Restyle <!-- Quiet Restyle -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@quietui/quiet-browser@1.6.1/dist/themes/restyle.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@quietui/quiet-browser@1.6.1/dist/themes/restyle.css">
-->
<script type="module" src="https://cdn.jsdelivr.net/npm/@quietui/quiet-browser@1.6.1/dist/quiet.loader.js"></script> <script type="module" src="https://cdn.jsdelivr.net/npm/@quietui/quiet-browser@1.6.1/dist/quiet.loader.js"></script>
@ -26,8 +26,8 @@
<div class="page-wrap"> <div class="page-wrap">
<header class="page-header"> <header class="page-header">
<div>XQuery 4.0 LSP client </div> <div> XQuery 4.0 LSP client </div>
<quiet-toggle-icon id="tConnect" label="Connection status" size="md" <quiet-toggle-icon id="tConnect" label="Connection status" size="lg"
style="--checked-color: green;--unchecked-color: red;"> style="--checked-color: green;--unchecked-color: red;">
<quiet-icon slot="unchecked" name="network-off" family="outline"></quiet-icon> <quiet-icon slot="unchecked" name="network-off" family="outline"></quiet-icon>
<quiet-icon slot="checked" name="network" family="outline"></quiet-icon> <quiet-icon slot="checked" name="network" family="outline"></quiet-icon>
@ -38,10 +38,10 @@
Editor Editor
</quiet-button> </quiet-button>
<quiet-button href="/app/home" target="lsp" rel="noreferrer noopener" size="sm"> <quiet-button href="/app/home" target="lsp" rel="noreferrer noopener" size="sm">
LSP Manager LSP Manager <quiet-icon name="external-link"></quiet-icon>
</quiet-button> </quiet-button>
<quiet-button href="/dba/logs" target="dba" rel="noreferrer noopener" size="sm"> <quiet-button href="/dba/logs" target="dba" rel="noreferrer noopener" size="sm">
Dba Dba <quiet-icon name="external-link"></quiet-icon>
</quiet-button> </quiet-button>
</quiet-toolbar> </quiet-toolbar>
<quiet-select id="load" style="width:20em;"> <quiet-select id="load" style="width:20em;">
@ -75,7 +75,7 @@
</header> </header>
<main class="page-main" style="overflow: auto;"> <main id="main" class="page-main" style="overflow: auto;">
<quiet-toolbar> <quiet-toolbar>
<quiet-button-group> <quiet-button-group>
@ -133,7 +133,7 @@
<aside class="page-sidebar"> <aside class="page-sidebar">
<details id="workspacePanel" open="open"> <details id="workspacePanel" open="open">
<summary class='bg-info'>Workspace <i class='codicon codicon-kebab-vertical' style="float:right"></i> <summary class='bg-info'>WORKSPACE <i class='codicon codicon-kebab-vertical' style="float:right"></i>
</summary> </summary>
@ -143,9 +143,9 @@
</details> </details>
<details id="symPanel"> <details id="symPanel">
<summary>OutLine <summary>OUTLINE
<quiet-dropdown id="dropdown__checkboxes" style="display:inline-block;float:right;"> <quiet-dropdown id="symOptions" style="display:inline-block;float:right;">
<quiet-icon name="dots-vertical" slot="trigger"></quiet-icon> <quiet-icon id="symTrigger" name="dots-vertical" slot="trigger"></quiet-icon>
<quiet-dropdown-item type="checkbox" value="canvas" checked>Follow cursor</quiet-dropdown-item> <quiet-dropdown-item type="checkbox" value="canvas" checked>Follow cursor</quiet-dropdown-item>
<quiet-divider></quiet-divider> <quiet-divider></quiet-divider>
@ -159,7 +159,7 @@
</details> </details>
<details id="msgPanel"> <details id="msgPanel">
<summary>Messages <summary>MESSAGES
<i id="msgIcon" class='codicon codicon-kebab-vertical' style="float:right"></i> <i id="msgIcon" class='codicon codicon-kebab-vertical' style="float:right"></i>
</summary> </summary>
<qd-list id="msgList" style="flex-grow:1;"></qd-list> <qd-list id="msgList" style="flex-grow:1;"></qd-list>

4
webapp/static/clients/codemirror/script.js
View file

@ -39,6 +39,10 @@ window.addEventListener('beforeunload', () => {
$("connect").onclick = e => { e.preventDefault(); connect() }; $("connect").onclick = e => { e.preventDefault(); connect() };
$("symTrigger").onclick = e => { e.preventDefault(); };
$("symOptions").onclick = e => { e.preventDefault(); };
$("bnNew").onclick = e => { alert("TODO"); };
$("search").onclick = e => lsp.openSearchPanel(view); $("search").onclick = e => lsp.openSearchPanel(view);
$("fullscreen").onclick = e => $("editor").requestFullscreen(); $("fullscreen").onclick = e => $("editor").requestFullscreen();

2
webapp/static/clients/codemirror/wc-qd-list.js
View file

@ -101,7 +101,7 @@ class ListComponent extends HTMLElement {
@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;overflow: auto;
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; cursor: pointer; width:100%; }
li:not(.selected) :hover { background-color: #ccc; } li:not(.selected) :hover { background-color: #ccc; }
.selected { background-color: #0d6efd;color: #ffff;} .selected { background-color: #0d6efd;color: #ffff;}
i {vertical-align: middle;} i {vertical-align: middle;}