diff --git a/edit.html b/edit.html
index 5025e1e0..09870371 100644
--- a/edit.html
+++ b/edit.html
@@ -271,7 +271,7 @@
- !
+ !
diff --git a/edit/base.js b/edit/base.js
index c2767592..b5d54726 100644
--- a/edit/base.js
+++ b/edit/base.js
@@ -368,6 +368,9 @@ function LivePreview() {
let preprocess;
let enabled = prefs.get('editor.livePreview');
+ const el = $('#preview-errors');
+ el.onclick = () => messageBoxProxy.alert(el.title, 'pre');
+
prefs.subscribe('editor.livePreview', (key, value) => {
if (!value) {
if (port) {
@@ -410,10 +413,9 @@ function LivePreview() {
}
async function updatePreviewer(data) {
- const errorContainer = $('#preview-errors');
try {
port.postMessage(preprocess ? await preprocess(data) : data);
- errorContainer.classList.add('hidden');
+ el.hidden = true;
} catch (err) {
if (Array.isArray(err)) {
err = err.join('\n');
@@ -422,10 +424,8 @@ function LivePreview() {
const pos = editor.getEditors()[0].posFromIndex(err.index);
err.message = `${pos.line}:${pos.ch} ${err.message || err}`;
}
- errorContainer.classList.remove('hidden');
- errorContainer.onclick = () => {
- messageBoxProxy.alert(err.message || `${err}`, 'pre');
- };
+ el.title = err.message || `${err}`;
+ el.hidden = false;
}
}
}
diff --git a/edit/edit.css b/edit/edit.css
index 6a3e482f..fc66d802 100644
--- a/edit/edit.css
+++ b/edit/edit.css
@@ -1030,7 +1030,8 @@ label {
flex-direction: row;
box-shadow: 0 0 3rem -.75rem;
}
- #header.sticky #basic-info,
+ #header.sticky #basic-info-name,
+ #header.sticky #basic-info-enabled > :not(#preview-errors),
#header.sticky #mozilla-format-buttons,
#header.sticky .buttons > button,
#header.sticky .split-btn-pedal,
@@ -1038,6 +1039,21 @@ label {
h2 {
display: none;
}
+ #preview-errors {
+ margin: -2px .75em 0 -.25em !important;
+ }
+ #header.sticky #basic-info {
+ margin: 0;
+ }
+ #header.sticky #preview-errors {
+ position: absolute;
+ top: var(--pad05);
+ right: var(--pad05);
+ margin: .25em 0 0 !important;
+ }
+ .popup-window #header.sticky #preview-errors {
+ right: calc(var(--pad05) + 24px);
+ }
.popup-window #details-wrapper {
margin-right: var(--popup-button-width);
}