mirror of
https://github.com/discourse/discourse.git
synced 2024-11-22 22:05:48 +08:00
FIX: Inline footnotes doesn’t work in the table at fullscreen (#27686)
* FIX: Inline footnotes doesn’t work in the table at fullscreen meta topic: https://meta.discourse.org/t/inline-footnotes-doesnt-work-in-the-table-at-fullscreen/313445
This commit is contained in:
parent
395cbbfe67
commit
f3130bc6d9
|
@ -156,7 +156,16 @@ export default {
|
||||||
function generateFullScreenTableModal(event) {
|
function generateFullScreenTableModal(event) {
|
||||||
const table = event.currentTarget.parentElement.nextElementSibling;
|
const table = event.currentTarget.parentElement.nextElementSibling;
|
||||||
const tempTable = table.cloneNode(true);
|
const tempTable = table.cloneNode(true);
|
||||||
modal.show(FullscreenTableModal, { model: { tableHtml: tempTable } });
|
const cookedWrapper = document.createElement("div");
|
||||||
|
cookedWrapper.classList.add("cooked");
|
||||||
|
if (siteSettings.display_footnotes_inline) {
|
||||||
|
cookedWrapper.classList.add("inline-footnotes");
|
||||||
|
}
|
||||||
|
cookedWrapper.dataset.refPostId = this.id;
|
||||||
|
cookedWrapper.appendChild(tempTable);
|
||||||
|
modal.show(FullscreenTableModal, {
|
||||||
|
model: { tableHtml: cookedWrapper },
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function generateSpreadsheetModal() {
|
function generateSpreadsheetModal() {
|
||||||
|
@ -228,7 +237,7 @@ export default {
|
||||||
buttonWrapper.append(expandTableBtn);
|
buttonWrapper.append(expandTableBtn);
|
||||||
expandTableBtn.addEventListener(
|
expandTableBtn.addEventListener(
|
||||||
"click",
|
"click",
|
||||||
generateFullScreenTableModal,
|
generateFullScreenTableModal.bind(attrs),
|
||||||
false
|
false
|
||||||
);
|
);
|
||||||
table.parentNode.insertBefore(buttonWrapper, table);
|
table.parentNode.insertBefore(buttonWrapper, table);
|
||||||
|
|
|
@ -65,7 +65,13 @@ function footnoteEventHandler(event) {
|
||||||
|
|
||||||
// append footnote to tooltip body
|
// append footnote to tooltip body
|
||||||
const footnoteContent = tooltip.querySelector(".footnote-tooltip-content");
|
const footnoteContent = tooltip.querySelector(".footnote-tooltip-content");
|
||||||
const cooked = expandableFootnote.closest(".cooked");
|
let cooked = expandableFootnote.closest(".cooked");
|
||||||
|
if (cooked.dataset.refPostId != null) {
|
||||||
|
// For full screen tables, redirect
|
||||||
|
cooked = document.querySelector(
|
||||||
|
`article[data-post-id="${cooked.dataset.refPostId}"] .cooked`
|
||||||
|
);
|
||||||
|
}
|
||||||
const newContent = cooked.querySelector(footnoteId);
|
const newContent = cooked.querySelector(footnoteId);
|
||||||
footnoteContent.innerHTML = newContent.innerHTML;
|
footnoteContent.innerHTML = newContent.innerHTML;
|
||||||
|
|
||||||
|
@ -107,7 +113,7 @@ export default {
|
||||||
}
|
}
|
||||||
|
|
||||||
document.body.append(buildTooltip());
|
document.body.append(buildTooltip());
|
||||||
window.addEventListener("click", footnoteEventHandler);
|
window.addEventListener("click", footnoteEventHandler, true);
|
||||||
|
|
||||||
withPluginApi("0.8.9", (api) => {
|
withPluginApi("0.8.9", (api) => {
|
||||||
api.decorateCookedElement((elem) => applyInlineFootnotes(elem), {
|
api.decorateCookedElement((elem) => applyInlineFootnotes(elem), {
|
||||||
|
|
|
@ -45,7 +45,7 @@
|
||||||
font-size: var(--font-down-1);
|
font-size: var(--font-down-1);
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
display: none;
|
display: none;
|
||||||
z-index: z("tooltip");
|
z-index: z("modal", "tooltip");
|
||||||
max-width: 400px;
|
max-width: 400px;
|
||||||
overflow-wrap: break-word;
|
overflow-wrap: break-word;
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue
Block a user