tweak headings
This commit is contained in:
parent
69b1413771
commit
8458a3e948
@ -6,7 +6,10 @@
|
||||
<link rel="stylesheet" href="./style.css" />
|
||||
<script type="module">
|
||||
import { Sim } from './simulator.js';
|
||||
const sim = new Sim('simulator');
|
||||
// Wait for document load
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
new Sim('simulator');
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@ -17,7 +17,7 @@ h1, h2, h3, h4, h5, h6 {
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 16pt;
|
||||
font-size: 14pt;
|
||||
}
|
||||
|
||||
div[id=simulator] {
|
||||
@ -77,10 +77,15 @@ div.lhg-tool button:active {
|
||||
div.lhg-toolbar-header:hover button {
|
||||
background-color: #444;
|
||||
}
|
||||
|
||||
div.lhg-toolbar-header:active button {
|
||||
background-color: #252;
|
||||
}
|
||||
|
||||
div.lhg-toolbar-header > * {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
div.lhg-tool button.lhg-tool-info {
|
||||
background-color: #111;
|
||||
border-color: #282;
|
||||
|
||||
2
sync
2
sync
@ -8,7 +8,7 @@ fi
|
||||
set -eo pipefail
|
||||
|
||||
do_rsync() {
|
||||
rsync -ru \
|
||||
rsync -vru \
|
||||
--exclude='.git' \
|
||||
--exclude='node_modules' \
|
||||
--exclude='.*.sw*' \
|
||||
|
||||
@ -6,22 +6,20 @@ export class Header extends Tool {
|
||||
|
||||
constructor(toolbar, title = 'Tools') {
|
||||
super(toolbar);
|
||||
|
||||
this.title = document.createElement('h1');
|
||||
this.title.innerHTML = title;
|
||||
|
||||
this.toggleButton = document.createElement('button');
|
||||
this.updateButton();
|
||||
this.div.addEventListener('click', () => this.toggle());
|
||||
this.updateButton();
|
||||
|
||||
this.div.appendChild(this.title);
|
||||
this.div.appendChild(this.toggleButton);
|
||||
|
||||
this.title.style.verticalAlign = 'center';
|
||||
this.toggleButton.style.width = '3EM';
|
||||
this.div.style.display = 'flex';
|
||||
this.div.style.justifyContent = 'space-around';
|
||||
|
||||
this.title.style.width = '9EM';
|
||||
this.toggleButton.style.width = '3EM';
|
||||
this.div.classList.add(TOOLBAR_HEADER_CLASSNAME);
|
||||
}
|
||||
|
||||
|
||||
12
tool/zoom.js
12
tool/zoom.js
@ -7,6 +7,14 @@ import {
|
||||
} from '../config.js';
|
||||
|
||||
export class Zoom extends Tool {
|
||||
get displayScale() {
|
||||
return this.sim.getScaleDisplay();
|
||||
}
|
||||
|
||||
get displayScaleText() {
|
||||
return `Scale: ${this.displayScale}`;
|
||||
}
|
||||
|
||||
constructor(toolbar) {
|
||||
super(toolbar);
|
||||
|
||||
@ -27,10 +35,10 @@ export class Zoom extends Tool {
|
||||
zoomOut.innerHTML = 'Zoom<br>Out';
|
||||
zoomIn.innerHTML = 'Zoom<br>In';
|
||||
zoomAll.innerHTML = 'Zoom to Fit';
|
||||
currentScale.innerHTML = `Scale: ${this.sim.getScaleDisplay()}`;
|
||||
currentScale.innerHTML = this.displayScaleText;
|
||||
|
||||
this.sim.onZoom(() => {
|
||||
currentScale.innerHTML = `Scale: ${this.sim.getScaleDisplay()}`;
|
||||
currentScale.innerHTML = this.displayScaleText;
|
||||
});
|
||||
|
||||
zoomOut.addEventListener('click', () => {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user