Skip to content

docs: update to latest bx-sites theme, remove home page version switcher #95

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
lmajano merged 1 commit into from
Oct 13, 2026
Merged

docs: update to latest bx-sites theme, remove home page version switcher #95

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
59 changes: 55 additions & 4 deletions docs/.theme/assets/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -364,10 +364,43 @@ body {
}

.sidebar {
display: flex;
flex-direction: column;
padding-top: 1.5rem;
background: var(--bxsites-sidebar-bg);
}

.sidebar-version-switcher {
width: auto;
max-width: none;
height: auto;
margin: 0 0 1rem;
padding: 0.4rem 0.6rem;
}

@media (min-width: 992px) {
.sidebar {
flex: 0 0 280px;
max-width: 280px;
position: sticky;
top: 56px;
height: calc(100vh - 56px);
overflow-y: auto;
}

.row:not(.bxsites-nav-collapsed) .content {
flex: 0 0 calc(100% - 280px);
max-width: calc(100% - 280px);
}
}

@media (min-width: 1200px) {
.row:not(.bxsites-nav-collapsed):has(.toc-sidebar) .content {
flex: 0 0 calc(100% - 280px - 16.66667%);
max-width: calc(100% - 280px - 16.66667%);
}
}

/* The toggler is Alpine-driven (layout.bxm's own `navOpen`) at every
width now, not just below `lg` - overrides Bootstrap's own
`.navbar-expand-lg .navbar-toggler { display: none }` (same
Expand Down Expand Up @@ -1071,23 +1104,41 @@ dd {
}

.toc-title {
display: flex;
align-items: center;
gap: 0.4rem;
font-weight: 600;
text-transform: uppercase;
font-size: 0.75rem;
color: var(--bxsites-muted);
margin-bottom: 0.25rem;
}

.toc-title svg {
flex: 0 0 auto;
opacity: 0.8;
}

.toc,
.toc-mobile {
font-size: 0.875rem;
}

.toc li,
.toc-mobile li {
margin: 0.35rem 0;
line-height: 1.4;
}

.toc .toc-level-3,
.toc-mobile .toc-level-3 {
padding-left: 1rem;
.toc .toc-level-4,
.toc-mobile .toc-level-3,
.toc-mobile .toc-level-4 {
padding-left: 0.85rem;
margin-left: 0.15rem;
border-left: 2px solid var(--bxsites-border);
font-size: 0.9em;
color: var(--bxsites-muted);
}

/* `theme.options.tocPosition: "sticky"` renders the same TOC list in its
Expand Down Expand Up @@ -2981,7 +3032,7 @@ a.button.primary {
display: flex;
align-items: center;
gap: 0.5rem;
margin: 1.5rem 0 0.5rem;
margin: auto 0 0.5rem;
padding: 0.7rem 0.85rem;
border: 1px solid currentColor;
border-radius: 0.75rem;
Expand All @@ -2996,7 +3047,7 @@ a.button.primary {
opacity: 1;
}

.bxsites-powered-by .bxsites-icon {
.bxsites-powered-by__logo {
width: 1.25rem;
height: 1.25rem;
flex: 0 0 auto;
Expand Down
59 changes: 35 additions & 24 deletions docs/.theme/blog.bxm
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,8 @@
variables.pageActionsPosition = variables.siteConfig.theme.options.pageActionsPosition ?: "top"
variables.accentColor = trim( variables.siteConfig.theme.options.accentColor ?: "" )
variables.accentColorDark = trim( variables.siteConfig.theme.options.accentColorDark ?: "" )
variables.navAccentLine = ( variables.siteConfig.theme.options.navAccentLine ?: true ) ? true : false
variables.navAccentLineColor = trim( variables.siteConfig.theme.options.navAccentLineColor ?: "" )
// page.bxm (this layout's own default body) reads variables.tocPosition
// directly for its inline "On this page" rendering - still needed here
// even though this layout drops the sticky-rail aside, since a listing
Expand Down Expand Up @@ -97,7 +99,7 @@
<!--- Base CSS and theme CSS --->
<link rel="stylesheet" href="#variables.basePath#assets/vendor/bootstrap/bootstrap.min.css">
<link rel="stylesheet" href="#variables.basePath#assets/vendor/highlight/github.min.css">
<link rel="stylesheet" href="#variables.basePath##variables.siteConfig.theme.styleUrl ?: 'assets/theme/style.css'#">
<link rel="stylesheet" href="#themeAssetUrl( 'style.css' )#">

<!--- Extra CSS --->
#renderExtraCss( variables.siteConfig.extraCss ?: [] )#
Expand All @@ -124,6 +126,17 @@
</style>
</bx:if>

<!--- Sidebar sub-menu accent line (theme.options.navAccentLine, default on) --->
<bx:if variables.navAccentLine>
<style>
.bxsites-nav-nested {
border-inline-start: 2px solid #len( variables.navAccentLineColor ) ? variables.navAccentLineColor : 'var(--bxsites-accent, var(--bxsites-border))'#;
margin-inline-start: 0.2rem;
padding-inline-start: 0.85rem;
}
</style>
</bx:if>

<!--- Math CSS --->
<bx:if variables.mathEnabled>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.11/dist/katex.min.css">
Expand All @@ -150,7 +163,7 @@
<script>window.__BXSITES_BASE_PATH__ = "#variables.basePath#";</script>
<script>window.__BXSITES_SEARCH_NO_RESULTS__ = "#encodeForJavaScript( variables.strings.searchNoResults )#";</script>
<script src="#variables.basePath#assets/vendor/minisearch/minisearch.js"></script>
<script src="#variables.basePath#assets/search.js" defer></script>
<script src="#moduleAssetUrl( 'search.js' )#" defer></script>
</bx:if>

<!--- Algolia search CSS --->
Expand Down Expand Up @@ -194,11 +207,6 @@
<bx:include template="#variables.themeDir#/search.bxm">
</bx:if>

<!--- Version switcher --->
<bx:if variables.versions.len() gt 1>
#renderVersionSwitcher( variables.versions, variables.currentVersion )#
</bx:if>

<!--- Locale dropdown --->
<bx:if variables.locales.len() gt 1>
#renderLocaleDropdown( variables.locales, variables.currentLocale )#
Expand Down Expand Up @@ -235,8 +243,12 @@
<div class="row" :class="{ 'bxsites-nav-collapsed' : !navOpen }">
<!--- Sidebar --->
<aside class="col-lg-3 col-xl-2 sidebar" id="bxsites-sidebar" x-show="navOpen" x-cloak>
<!--- Version switcher (moved above the nav tree) --->
<bx:if variables.versions.len() gt 1>
#renderVersionSwitcher( variables.versions, variables.currentVersion, 'form-select form-select-sm sidebar-version-switcher' )#
</bx:if>
#renderNavList( variables.nav )#
<a class="bxsites-powered-by" href="https://bxsites.io" target="_blank" rel="noopener noreferrer">#bxsitesIcon( "phosphor:stack" )# <span>Powered by BxSites</span></a>
<a class="bxsites-powered-by" href="https://bxsites.io" target="_blank" rel="noopener noreferrer"><img class="bxsites-powered-by__logo" src="#moduleAssetUrl( 'bxsites-logo.svg' )#" alt="" aria-hidden="true"> <span>Powered by BxSites</span></a>
</aside>

<!--- Main content (full width the sticky TOC rail would otherwise reserve) --->
Expand All @@ -263,41 +275,41 @@
<!--- Core scripts --->
<script src="#variables.basePath#assets/vendor/bootstrap/bootstrap.bundle.min.js"></script>
<script src="#variables.basePath#assets/vendor/highlight/highlight.min.js"></script>
<script src="#variables.basePath#assets/highlight-boxlang.js"></script>
<script src="#moduleAssetUrl( 'highlight-boxlang.js' )#"></script>
<script>hljs.highlightAll();</script>
<script src="#variables.basePath#assets/code-lines.js"></script>
<script src="#variables.basePath#assets/copy-code.js" defer></script>
<script src="#variables.basePath#assets/admonition-collapse.js" defer></script>
<script src="#variables.basePath#assets/nav-toggle.js" defer></script>
<script src="#variables.basePath#assets/toc-collapse.js" defer></script>
<script src="#variables.basePath#assets/tabs.js" defer></script>
<script src="#variables.basePath#assets/conditional-content-init.js" defer></script>
<script src="#variables.basePath#assets/course-progress.js" defer></script>
<script src="#variables.basePath#assets/prompt-init.js" defer></script>
<script src="#variables.basePath#assets/contact-form-init.js" defer></script>
<script src="#moduleAssetUrl( 'code-lines.js' )#"></script>
<script src="#moduleAssetUrl( 'copy-code.js' )#" defer></script>
<script src="#moduleAssetUrl( 'admonition-collapse.js' )#" defer></script>
<script src="#moduleAssetUrl( 'nav-toggle.js' )#" defer></script>
<script src="#moduleAssetUrl( 'toc-collapse.js' )#" defer></script>
<script src="#moduleAssetUrl( 'tabs.js' )#" defer></script>
<script src="#moduleAssetUrl( 'conditional-content-init.js' )#" defer></script>
<script src="#moduleAssetUrl( 'course-progress.js' )#" defer></script>
<script src="#moduleAssetUrl( 'prompt-init.js' )#" defer></script>
<script src="#moduleAssetUrl( 'contact-form-init.js' )#" defer></script>

<!--- Page actions --->
<bx:if variables.pageActionsEnabled>
<script src="#variables.basePath#assets/page-actions-init.js" defer></script>
<script src="#moduleAssetUrl( 'page-actions-init.js' )#" defer></script>
</bx:if>

<!--- Mermaid --->
<bx:if variables.mermaidEnabled>
<script src="#variables.basePath#assets/vendor/mermaid/mermaid.min.js"></script>
<script src="#variables.basePath#assets/mermaid-init.js"></script>
<script src="#moduleAssetUrl( 'mermaid-init.js' )#"></script>
</bx:if>

<!--- Math --->
<bx:if variables.mathEnabled>
<script src="https://cdn.jsdelivr.net/npm/katex@0.16.11/dist/katex.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/katex@0.16.11/dist/contrib/auto-render.min.js"></script>
<script src="#variables.basePath#assets/math-init.js"></script>
<script src="#moduleAssetUrl( 'math-init.js' )#"></script>
</bx:if>

<!--- OpenAPI --->
<bx:if variables.openapiEnabled>
<script src="#variables.basePath#assets/vendor/swagger-ui/swagger-ui-bundle.js"></script>
<script src="#variables.basePath#assets/openapi-init.js"></script>
<script src="#moduleAssetUrl( 'openapi-init.js' )#"></script>
</bx:if>

<!--- Search (Algolia) --->
Expand Down Expand Up @@ -340,7 +352,6 @@
</bx:if>

<!--- Extra JS --->
<script src="#variables.basePath#assets/theme/tooltips.js" defer></script>
#renderExtraJs( variables.siteConfig.extraJs ?: [] )#
</body>
</html>
Expand Down
13 changes: 5 additions & 8 deletions docs/.theme/home.bxm
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -88,8 +88,8 @@
<!--- Vendor and theme styles --->
<link rel="stylesheet" href="#variables.basePath#assets/vendor/bootstrap/bootstrap.min.css">
<link rel="stylesheet" href="#variables.basePath#assets/vendor/highlight/github.min.css">
<link rel="stylesheet" href="#variables.basePath##variables.siteConfig.theme.styleUrl ?: 'assets/theme/style.css'#">
<link rel="stylesheet" href="#variables.basePath#assets/theme/home.css">
<link rel="stylesheet" href="#themeAssetUrl( 'style.css' )#">
<link rel="stylesheet" href="#themeAssetUrl( 'home.css' )#">

<!--- Extra CSS --->
#renderExtraCss( variables.siteConfig.extraCss ?: [] )#
Expand Down Expand Up @@ -140,7 +140,7 @@
<script>window.__BXSITES_BASE_PATH__ = "#variables.basePath#";</script>
<script>window.__BXSITES_SEARCH_NO_RESULTS__ = "#encodeForJavaScript( variables.strings.searchNoResults )#";</script>
<script src="#variables.basePath#assets/vendor/minisearch/minisearch.js"></script>
<script src="#variables.basePath#assets/search.js" defer></script>
<script src="#moduleAssetUrl( 'search.js' )#" defer></script>
</bx:if>

<!--- Algolia search styles --->
Expand Down Expand Up @@ -173,9 +173,6 @@
</nav>
<div class="bxh-navcta">
<div class="bxh-nav-utils">
<bx:if variables.versions.len() gt 1>
#renderVersionSwitcher( variables.versions, variables.currentVersion )#
</bx:if>
<bx:if variables.locales.len() gt 1>
#renderLocaleDropdown( variables.locales, variables.currentLocale )#
</bx:if>
Expand Down Expand Up @@ -839,14 +836,14 @@
<div class="bxh-wrap footer-bottom footrow">
<span>&copy; #year( now() )# Ortus Solutions. Apache 2.0 License.</span>
<div class="footlinks">
<a class="footverse" href="https://www.bible.com/bible/59/JHN.14.6.ESV" target="_blank" rel="noopener noreferrer"><span aria-hidden="true">&#10084;&#65039;</span> He is the truth and the life</a>
<a class="footverse" href="https://www.bible.com/bible/59/JHN.14.6.ESV" target="_blank" rel="noopener noreferrer"><span aria-hidden="true">&##10084;&##65039;</span> He is the truth and the life</a>
<a class="poweredby" href="https://coldbox.ortusbooks.com" target="_blank" rel="noopener noreferrer">Part of the <b>ColdBox</b> platform</a>
</div>
</div>
</footer>

<!--- Extra JavaScript --->
<script src="#variables.basePath#assets/theme/tooltips.js" defer></script>
<script src="#themeAssetUrl( 'tooltips.js' )#" defer></script>
#renderExtraJs( variables.siteConfig.extraJs ?: [] )#
</body>
</html>
Expand Down
4 changes: 2 additions & 2 deletions docs/.theme/includes/page-helpers.bxm
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -117,10 +117,10 @@
listHtml &= '</ul>'

if ( arguments.hideAtXl ) {
return '<details class="bxsites-toc-mobile toc-mobile d-xl-none"><summary class="toc-mobile__summary">' & encodeForHTML( variables.strings.onThisPage ) & '</summary>' & listHtml & '</details>'
return '<details class="bxsites-toc-mobile toc-mobile d-xl-none"><summary class="toc-mobile__summary">' & bxsitesIcon( "outline" ) & ' ' & encodeForHTML( variables.strings.onThisPage ) & '</summary>' & listHtml & '</details>'
}

return '<nav class="toc mb-4" aria-label="' & encodeForHTML( variables.strings.onThisPage ) & '"><div class="toc-title">' & encodeForHTML( variables.strings.onThisPage ) & '</div>' & listHtml & '</nav>'
return '<nav class="toc bxsites-toc mb-4" aria-label="' & encodeForHTML( variables.strings.onThisPage ) & '"><div class="toc-title bxsites-toc__title">' & bxsitesIcon( "outline" ) & ' ' & encodeForHTML( variables.strings.onThisPage ) & '</div>' & listHtml & '</nav>'
}

/**
Expand Down
19 changes: 1 addition & 18 deletions docs/.theme/includes/site-helpers.bxm
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@
* `navExpandAll` is on. `nested`/`collapsed` track recursion state.
*/
function renderNavList( required array nodes, boolean nested = false, boolean collapsed = false ) {
var html = sb{ "<ul class=""nav flex-column" & ( arguments.nested ? " nav--nested" : "" ) & """" & ( arguments.collapsed ? " hidden" : "" ) & ">" }
var html = sb{ "<ul class=""nav flex-column" & ( arguments.nested ? " nav--nested bxsites-nav-nested" : "" ) & """" & ( arguments.collapsed ? " hidden" : "" ) & ">" }
for ( var node in arguments.nodes ) {
var isActive = len( node.url ) && ( node.url == variables.page.urlPath || ( len( variables.page.course.id ) && node.url == variables.page.course.indexUrl ) )
var linkClass = "nav-link" & ( isActive ? " active" : "" )
Expand Down Expand Up @@ -118,23 +118,6 @@
return html
}

/**
* Renders the docs version switcher - a plain <select> whose onchange
* handler jumps straight to the picked version's own URL (no JS
* framework needed). Labels/URLs come from bxsites.yaml's own
* versioning config; the current version's option is marked selected.
* Only rendered when there is more than one version.
*/
function renderVersionSwitcher( required array versions, required string currentVersion ) {
var html = sb{ '<select class="version-switcher form-select form-select-sm" onchange="location.href=this.value" aria-label="' & encodeForHTML( variables.strings.version ) & '">' }
for ( var v in arguments.versions ) {
var selected = v.label == arguments.currentVersion ? " selected" : ""
html &= '<option value="' & bxsitesUrlAttr( v.url ) & '"' & selected & '>' & encodeForHTML( v.label ) & '</option>'
}
html &= '</select>'
return html
}

/**
* A flag-icon dropdown - the trigger button shows the
* current locale's own flag, opening a menu listing every locale by
Expand Down
Loading
Loading