research/dope2-webapp
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

bump dependencies + proper toolbar line breaks

Browse source
This commit is contained in:
Joeri Exelmans 2025-06-05 10:24:46 +02:00
parent 4a89ccd5d1
commit 9bab65167b
6 changed files with 349 additions and 308 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/component/app/App.css
View file

@ -54,6 +54,7 @@ footer a {
border-radius: 5px;
padding: 0 6px 0 6px;
margin: 0 4px 0 4px;
/* display: inline-block; */
}
.command.highlighted {

70
src/component/app/App.tsx
View file

@ -169,35 +169,45 @@ export function App() {
return (
<>
<header>
<button disabled={appState.history.length===1} onClick={onUndo}>Undo ({appState.history.length-1}) <kbd>Ctrl</kbd>+<kbd>Z</kbd></button>
<button disabled={appState.future.length===0} onClick={onRedo}>Redo ({appState.future.length}) <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>Z</kbd></button>
<button onClick={onCopy}>Copy <kbd>Ctrl</kbd>+<kbd>C</kbd></button>
<button onClick={onPaste}>Paste <kbd>Ctrl</kbd>+<kbd>V</kbd></button>
{
actionShortcuts.map(([_, keys, descr], i) =>
<span key={i} className={'command' + (highlighted[i] ? (' highlighted') : '')}>
{keys.map((key, j) => <kbd key={j}>{key}</kbd>)}
&nbsp;
{descr}
</span>)
}
<select onChange={onSelectExample} value={-1}>
<option value={-1}>load example...</option>
{
examples.map(([name], i) => {
return <option key={i} value={i}>{name}</option>;
})
}
</select>
<button className="factoryReset" onClick={factoryReset}>
FACTORY RESET
</button>
<label>
<input type="checkbox"
checked={syntacticSugar}
onChange={e => setSyntacticSugar(e.target.checked)}/>
syntactic sugar
</label>
<span className="line">
<button disabled={appState.history.length===1} onClick={onUndo}>Undo ({appState.history.length-1}) <kbd>Ctrl</kbd>+<kbd>Z</kbd></button>
<button disabled={appState.future.length===0} onClick={onRedo}>Redo ({appState.future.length}) <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>Z</kbd></button>
<button onClick={onCopy}>Copy <kbd>Ctrl</kbd>+<kbd>C</kbd></button>
<button onClick={onPaste}>Paste <kbd>Ctrl</kbd>+<kbd>V</kbd></button>
</span>
<span className="line">
<span className="line">
{
actionShortcuts.map(([_, keys, descr], i) =>
<span key={i} className={'command' + (highlighted[i] ? (' highlighted') : '')}>
{keys.map((key, j) => <kbd key={j}>{key}</kbd>)}
&nbsp;
{descr}
</span>)
}
</span>
<span className="line">
<select onChange={onSelectExample} value={-1}>
<option value={-1}>load example...</option>
{
examples.map(([name], i) => {
return <option key={i} value={i}>{name}</option>;
})
}
</select>
<button className="factoryReset" onClick={factoryReset}>
FACTORY RESET
</button>
<span className="line">
<label>
<input type="checkbox"
checked={syntacticSugar}
onChange={e => setSyntacticSugar(e.target.checked)}/>
syntactic sugar
</label>
</span>
</span>
</span>
</header>
<main onKeyDown={onKeyDown}>
@ -224,7 +234,7 @@ export function App() {
</main>
<footer>
<a href="https://deemz.org/git/joeri/dope2-webapp">Source code</a>
<a href="https://deemz.org/git/research/dope2-webapp">Source code</a>
</footer>
</>
)

1
src/component/expr/InputBlock.tsx
View file

@ -11,7 +11,6 @@ import { Type as TypeBlock, TypeInfoBlock } from "../other/Type";
import type { ExprBlockState, State2Props } from "./ExprBlock";
import "./InputBlock.css";
import { evalExpr } from "../../eval/eval";
interface Literal {
kind: "literal";

4
src/index.css
View file

@ -37,4 +37,8 @@ kbd {
::selection {
color: white;
background: dodgerblue;
}
span.line {
display: inline-block;
}