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); }