MokoConsulting/MokoCassiopeia
1
1
Fork 0
Code Issues 2 Pull Requests Actions Packages Releases 1 Activity

Implement conditional TOC loading and cleanup Bootstrap/TOC code

Browse Source 
Co-authored-by: jmiller-moko <230051081+jmiller-moko@users.noreply.github.com>
This commit is contained in:
copilot-swe-agent[bot]
2026-01-30 05:40:40 +00:00
parent d2ab55d9b0
commit 89a27c4bd6
5 changed files with 2 additions and 178 deletions
Download Patch File Download Diff File Expand all files Collapse all files

100
src/media/css/template.css
View File

@@ -14012,10 +14012,6 @@ meter {
border-bottom-left-radius: 0;
}
.article-index .toclink.active {
color: currentColor;
}
.j-main-container .alert {
margin: 0.75rem;
}
@@ -16786,102 +16782,6 @@ form .form-select {
border-color: #C7C7C7
}
/* --- TOC right-rail container (non-invasive) --- */
.container-toc-right {
float: right;
width: 280px;
margin: 0 0 1.25rem 1.25rem;
/* gap from main content */
position: relative;
z-index: 1;
color: var(--container-toc-color);
}
/* Make the inner nav sticky without touching bootstrap-toc styles */
.container-toc-right>nav[id='toc'] {
position: sticky;
top: 6rem;
/* adjust to sit below your header/nav */
max-height: calc(100vh - 7rem);
overflow: auto;
background: var(--container-toc-bg);
border: 1px solid rgba(0, 0, 0, .08);
border-radius: .75rem;
padding: 1rem;
box-shadow: 0 4px 12px rgba(0, 0, 0, .06);
}
/* Optional: title spacing if you render a heading inside #toc */
.container-toc-right>nav[id='toc']>.toc-title {
margin: 0 0 .5rem 0;
font-weight: 600;
border-bottom: 1px solid rgba(0, 0, 0, .06);
padding-bottom: .5rem;
}
/* Responsive: stack on smaller screens */
@media (max-width: 991.98px) {
.container-toc-right {
float: none;
width: 100%;
margin: 1rem 0;
}
.container-toc-right>nav[id='toc'] {
position: relative;
top: auto;
max-height: 300px;
}
}
/* --- TOC left-rail container (non-invasive) --- */
.container-toc-left {
float: left;
width: 280px;
margin: 0 1.25rem 1.25rem 0;
/* space on right side for main content */
position: relative;
z-index: 1;
color: var(--container-toc-color);
}
/* Make the inner nav sticky without altering bootstrap-toc core styles */
.container-toc-left>nav[id='toc'] {
position: sticky;
top: 6rem;
/* adjust if your site header height differs */
max-height: calc(100vh - 7rem);
overflow: auto;
background: var(--bs-body-bg, #fff);
border: 1px solid rgba(0, 0, 0, .08);
border-radius: .75rem;
padding: 1rem;
box-shadow: 0 4px 12px rgba(0, 0, 0, .06);
}
/* Optional: TOC title styling */
.container-toc-left>nav[id='toc']>.toc-title {
margin: 0 0 .5rem 0;
font-weight: 600;
border-bottom: 1px solid rgba(0, 0, 0, .06);
padding-bottom: .5rem;
}
/* Responsive: stack under content on smaller screens */
@media (max-width: 991.98px) {
.container-toc-left {
float: none;
width: 100%;
margin: 1rem 0;
}
.container-toc-left>nav[id='toc'] {
position: relative;
top: auto;
max-height: 300px;
}
}
.container-below-topbar {
padding: var(--padding-x) var(--padding-y);
background-image: var(--container-below-topbar-bg-image);

20
src/media/js/template.js
View File

@@ -11,17 +11,12 @@
INGROUP: MokoCassiopeia
PATH: ./media/templates/site/moko-cassiopeia/js/template.js
VERSION: 03.06.01
BRIEF: Consolidated JavaScript for MokoCassiopeia template including theme, TOC, and utilities
BRIEF: Consolidated JavaScript for MokoCassiopeia template including theme and utilities
*/
(function (win, doc) {
"use strict";
// ========================================================================
// BOOTSTRAP TOC (inline minified version)
// ========================================================================
!function(a){"use strict";window.Toc={helpers:{findOrFilter:function(e,t){var n=e.find(t);return e.filter(t).add(n).filter(":not([data-toc-skip])")},generateUniqueIdBase:function(e){return a(e).text().trim().replace(/\'/gi,"").replace(/[& +$,:;=?@"#{}|^~[`%!'<>\]\.\/\(\)\*\\\n\t\b\v]/g,"-").replace(/-{2,}/g,"-").substring(0,64).replace(/^-+|-+$/gm,"").toLowerCase()||e.tagName.toLowerCase()},generateUniqueId:function(e){for(var t=this.generateUniqueIdBase(e),n=0;;n++){var r=t;if(0<n&&(r+="-"+n),!document.getElementById(r))return r}},generateAnchor:function(e){if(e.id)return e.id;var t=this.generateUniqueId(e);return e.id=t},createNavList:function(){return a('<ul class="nav navbar-nav"></ul>')},createChildNavList:function(e){var t=this.createNavList();return e.append(t),t},generateNavEl:function(e,t){var n=a('<a class="nav-link"></a>');n.attr("href","#"+e),n.text(t);var r=a("<li></li>");return r.append(n),r},generateNavItem:function(e){var t=this.generateAnchor(e),n=a(e),r=n.data("toc-text")||n.text();return this.generateNavEl(t,r)},getTopLevel:function(e){for(var t=1;t<=6;t++){if(1<this.findOrFilter(e,"h"+t).length)return t}return 1},getHeadings:function(e,t){var n="h"+t,r="h"+(t+1);return this.findOrFilter(e,n+","+r)},getNavLevel:function(e){return parseInt(e.tagName.charAt(1),10)},populateNav:function(r,a,e){var i,s=r,c=this;e.each(function(e,t){var n=c.generateNavItem(t);c.getNavLevel(t)===a?s=r:i&&s===r&&(s=c.createChildNavList(i)),s.append(n),i=n})},parseOps:function(e){var t;return(t=e.jquery?{$nav:e}:e).$scope=t.$scope||a(document.body),t}},init:function(e){(e=this.helpers.parseOps(e)).$nav.attr("data-toggle","toc");var t=this.helpers.createChildNavList(e.$nav),n=this.helpers.getTopLevel(e.$scope),r=this.helpers.getHeadings(e.$scope,n);this.helpers.populateNav(t,n,r)}},a(function(){a('nav[data-toggle="toc"]').each(function(e,t){var n=a(t);Toc.init(n)})})}(jQuery);
// ========================================================================
// THEME INITIALIZATION (Early theme application)
// ========================================================================
@@ -196,18 +191,6 @@
}
}
/**
* Initialize Bootstrap TOC if #toc element exists.
*/
function initTOC() {
if (typeof win.Toc !== "undefined" && doc.querySelector("#toc")) {
win.Toc.init({
$nav: $("#toc"),
$scope: $("main")
});
}
}
/**
* Initialize offcanvas drawer buttons for left/right drawers.
*/
@@ -305,7 +288,6 @@
win.addEventListener("scroll", handleScroll);
// Init features
initTOC();
initDrawers();
initBackTop();
}