improve table viewing on mobile (still not great)

This commit is contained in:
Cory LaViska
2021-08-19 08:28:52 -04:00
parent 2af3831366
commit 99750b8edb
2 changed files with 24 additions and 0 deletions

View File

@@ -435,5 +435,19 @@
next(content);
});
// Wrap tables so we can scroll them horizontally when needed
hook.doneEach(function () {
const content = document.querySelector('.content');
const tables = [...content.querySelectorAll('table')];
tables.map(table => {
table.outerHTML = `
<div class="table-wrapper">
${table.outerHTML}
</div>
`;
});
});
});
})();

View File

@@ -456,6 +456,16 @@ strong {
}
/* Tables */
.table-wrapper {
overflow-x: auto;
}
@media screen and (max-width: 1200px) {
.table-wrapper table {
min-width: 800px;
}
}
.markdown-section table {
display: table;
margin-bottom: 1.5rem;