[mod] update ebnf

This commit is contained in:
Andy Bunce 2025-12-27 11:05:18 +00:00
parent 3d94ef0d60
commit 7f55855473
12 changed files with 2491 additions and 235 deletions

View file

@ -1,3 +1,9 @@
/* WA customizations for codemirror6 client */
:root {
color-scheme: light dark;
--wa-focus-ring-offset: 0 /* 0.0625rem */;
}
:root,
.wa-light,
.wa-dark .wa-invert {

View file

@ -9,15 +9,15 @@
<link rel="stylesheet" href="../../webawesome/dist-cdn/styles/webawesome.css" />
<link rel="icon" type="image/png" href="../favicon.png" />
<script type="module" src="wa-setup.js"></script>
<link rel="stylesheet" href="wa.css" />
<script type="module" src="wa-setup.js"></script>
</head>
<body>
<div class="page-wrap">
<header class="page-header">
<wa-dropdown>
<wa-button slot="trigger" with-caret>File</wa-button>
<wa-button slot="trigger" with-caret appearance="plain" variant="neutral">File</wa-button>
<wa-dropdown-item id="bnNew">
<wa-icon slot="icon" library="tabler" name="file"></wa-icon>New...
<div slot="details">empty document</div>
@ -45,9 +45,9 @@
</div>
<wa-button-group>
<wa-button-group style="margin-right: 0.2rem;" >
<wa-dropdown>
<wa-button slot="trigger" with-caret>Dev tools</wa-button>
<wa-button slot="trigger" with-caret appearance="plain" variant="neutral">Dev tools</wa-button>
<wa-dropdown-item>
<wa-icon slot="icon" library="tabler" name="external-link"></wa-icon>
<a href="/app/home" target="lsp" rel="noreferrer noopener">LSP Manager</a>
@ -58,9 +58,9 @@
</wa-dropdown-item>
<wa-divider></wa-divider>
</wa-dropdown>
<button popovertarget="popAbout" type="button">
<wa-icon library="tabler" name="help" label="Home" slot="start"></wa-icon>
</button>
<wa-button popovertarget="popAbout" appearance="plain" variant="neutral">
<wa-icon library="tabler" name="help" label="Home"></wa-icon>
</wa-button>
</wa-button-group>
</header>

View file

@ -0,0 +1,159 @@
:root,
.wa-light,
.wa-dark .wa-invert {
--wa-color-surface-raised: var(--wa-color-neutral-95);
--wa-color-surface-default: var(--wa-color-neutral-90);
--wa-color-surface-lowered: var(--wa-color-neutral-80);
}
wa-button-group>wa-button::part(base) {
background-color: var(--wa-color-neutral-95);
border: 1px solid var(--wa-color-border-quiet);
color: var(--wa-color-on-quiet);
}
wa-button-group>wa-button::part(base):hover {
transform: scale(1.05);
background-color: var(--wa-color-neutral-80);
}
.wrapper{
display: flex;
flex-direction: column;
height: 100%;
}
.header{
background-color: orange;
height: 100px;
}
.middle{
display: flex;
flex: 1;
}
.left-panel{
background-color: lightgreen;
width: 100px;
}
.body-content{
background-color: pink;
display: flex;
justify-content: center;
align-items: center;
flex: 1;
}
.right-panel{
background-color: skyblue;
width: 100px;
}
.footer{
background-color: grey;
height: 100px;
}
/***********************
codemirror6 search panel tweaks to show close
**********************/
.cm-panel.cm-search [name="close"] {
color: black
}
.cm-panel.cm-panel-lint [name="close"] {
color: black
}
.cm-panel.cm-search [name="search"] {
width:98%;
}
form header {
background-color: burlywood;
}
html,
body {
min-height: 100%;
height: 100%;
padding: 0;
margin: 0;
}
.page-wrap {
background: white;
height: 100%;
display: flex;
flex-direction: column;
overflow: hidden;
}
details[open] {
flex-grow: 1;
overflow: hidden;
}
summary {
background-color: var(--quiet-neutral-fill-softer);
}
/* Set editor dimensions */
#editor {
max-width: 100%;
max-height: 100%;
overflow: hidden;
}
/* Stretch editor to fit inside its containing div */
.cm-editor {
height: 100%;
width: 100%;
overflow: auto;
}
details[open]::details-content {
padding: 0.1em;
border: thin solid grey;
overflow: auto;
}
::backdrop {
backdrop-filter: blur(2px);
}
#tConnect:state(unchecked) {
outline: dashed 4px deeppink;
outline-offset: 4px;
}
.page-header {
grid-column: 1 / -1;
display: flex;
justify-content: space-between;
}
.page-sidebar {
grid-column: 1 / 2;
grid-row: 2 / 4;
display: flex;
flex-direction: column;
details {
display: flex;
flex-direction: column;
}
}
.page-nav {
grid-column: 2 / 3;
background: red;
}
.page-main {
grid-column: 2 / 3;
display: flex;
flex-direction: column;
}
.page-footer {
grid-column: 1 / -1;
background: #ffecb3;
display: flex;
justify-content: space-between;
padding: 2px;
}

View file

@ -11,24 +11,25 @@
<link rel="icon" type="image/png" href="../favicon.png" />
<script type="module" src="wa-setup.js"></script>
<link rel="stylesheet" href="wa.css" />
<link rel="stylesheet" href="wa2.css" />
</head>
<body>
<div class="page-wrap">
<wa-button appearance="filled-outlined" variant="neutral">Filled-Outlined</wa-button>
<button>
ddddd
</button>
</div>
<section class='wrapper'>
<section>
<div class='header'>Header</div>
</section>
<section class='middle'>
<div class='left-panel'>LeftPanel</div>
<div id="editor" class='body-content'>Body</div>
<div class='right-panel'>RightPanel</div>
</section>
<section>
<div class='footer'>Footer</div>
</section>
</section>
<script src="./lsp.bundle.js"></script>
<script src="./script.js"></script>
</body>
</html>