TryGhost / Source

The default theme for Ghost
https://source.ghost.io
MIT License
66 stars 134 forks source link

Issue with table wrapper in main.js #41

Closed GraydonGit closed 7 months ago

GraydonGit commented 9 months ago

Hi there,

I ran into a problem when I included more than four tables in a single blog post; they all appeared clustered together. It was quite odd, but I believe I've discovered a workaround.

At the end of the file changed:

main.js:

/* Responsive HTML table */
(function () {
    const tables = document.querySelectorAll('.gh-content > table:not(.gist table)');
    const wrapper = document.createElement('div');
    wrapper.className = 'gh-table';

    tables.forEach(function (table) {
        table.parentNode.insertBefore(wrapper, table);
        wrapper.appendChild(table);
    });
})();

TO:

/* Responsive HTML table */
(function () {
    const tables = document.querySelectorAll('.gh-content > table:not(.gist table)');

    tables.forEach(function (table) {
        const wrapper = document.createElement('div');
        wrapper.className = 'gh-table';
        table.parentNode.insertBefore(wrapper, table);
        wrapper.appendChild(table);
    });
})();
gituliar commented 8 months ago

+1 Facing the same issue.

minimaluminium commented 7 months ago

Thanks @GraydonGit for the proposed fix. This is now included in Source 1.2.2.