minio/docs
1
0
Fork 0
mirror of https://github.com/minio/docs.git synced 2025-07-28 19:42:10 +03:00
Code Activity

UI Enhancements: TOC depth and Table scrollbars (#542)

Browse Source 
* Fix TOC depth

* Add custom scrollbars to tables
This commit is contained in:
Rushan
2022-09-06 19:44:56 +04:00
committed by GitHub
parent 705ec2cf45
commit fc85a37c70
7 changed files with 120 additions and 143 deletions
Download Patch File Download Diff File Expand all files Collapse all files

74
source/_static/js/main.js
View File

@ -1,5 +1,5 @@
window.addEventListener("DOMContentLoaded", (event) => {
const tocMenuEl = document.querySelector(".content__toc__inner > ul");
const tocMenuEl = document.querySelector("#table-of-contents > ul.simple");
var readModeLs = localStorage.getItem("read-mode");
// --------------------------------------------------
@ -10,6 +10,17 @@ window.addEventListener("DOMContentLoaded", (event) => {
}
// --------------------------------------------------
// Detect parent iframe.
// This is required to hide the navigation links when viewed via PathFactory for analytics purposes
// --------------------------------------------------
(function () {
if (window.location !== window.parent.location) {
document.body.classList.add("inside-iframe");
}
})();
// --------------------------------------------------
// Read mode
// --------------------------------------------------
@ -91,17 +102,6 @@ window.addEventListener("DOMContentLoaded", (event) => {
})();
// --------------------------------------------------
// Detect parent iframe.
// This is required to hide the navigation links when viewed via PathFactory for analytics purposes
// --------------------------------------------------
(function () {
if (window.location !== window.parent.location) {
document.body.classList.add("inside-iframe");
}
})();
// --------------------------------------------------
// Get meta key based on the OS
// --------------------------------------------------
@ -120,6 +120,34 @@ window.addEventListener("DOMContentLoaded", (event) => {
})();
// --------------------------------------------------
// TOC
// --------------------------------------------------
(function () {
// Move the TOC to the right side of the page
const tocOriginalEl = document.getElementById("table-of-contents");
const tocTargetEl = document.getElementById("content-toc");
const tocAsideEL = document.querySelector(".content__toc");
if (tocOriginalEl) {
tocTargetEl.parentNode.replaceChild(tocOriginalEl, tocTargetEl);
}
else {
tocAsideEL.style.display = "none";
}
// Treat the TOC as a dropdown in mobile
const tocToggleEl = document.querySelector(".topic-title");
if(tocToggleEl) {
tocToggleEl.addEventListener("click", (event) => {
event.preventDefault();
tocMenuEl.closest(".content__toc").classList.toggle("active");
});
}
})();
// --------------------------------------------------
// Cookie banner
// --------------------------------------------------
@ -211,6 +239,11 @@ window.addEventListener("DOMContentLoaded", (event) => {
function hideAside() {
document.querySelector(".aside-backdrop").remove();
document.documentElement.classList.remove("doc-active", "nav-active");
// Hide opened toc menu on mobile
if(tocMenuEl) {
tocMenuEl.closest(".content__toc").classList.remove("active");
}
}
asideToggleEls.forEach((item) => {
@ -244,21 +277,6 @@ window.addEventListener("DOMContentLoaded", (event) => {
});
})();
// --------------------------------------------------
// TOC in mobile
// --------------------------------------------------
(function () {
const tocToggleEl = document.querySelector(".content__toc__inner > h3 > a");
if(tocToggleEl) {
tocToggleEl.addEventListener("click", (event) => {
event.preventDefault();
tocMenuEl.closest(".content__toc").classList.toggle("active");
});
}
})();
// --------------------------------------------------
// Icon switches
@ -344,7 +362,7 @@ window.addEventListener("DOMContentLoaded", (event) => {
if(tableEls.length > 0) {
tableEls.forEach((item) => {
var tableWrapper = document.createElement("div");
tableWrapper.classList.add("table-responsive");
tableWrapper.classList.add("table-responsive", "scrollbar");
item.insertAdjacentElement("beforebegin", tableWrapper);
tableWrapper.appendChild(item);
});