mirror of
https://github.com/harvard-edge/cs249r_book.git
synced 2026-07-16 14:42:29 -05:00
96 lines
3.5 KiB
HTML
96 lines
3.5 KiB
HTML
<script>
|
|
// Inject subtitle + framework version chip under sidebar logo.
|
|
// The chip's version literal is sourced from tinytorch/settings.ini and
|
|
// kept in sync by the tinytorch-publish-live workflow's UPDATE_VERSION
|
|
// step on each release. Update marker for sed: TINYTORCH_VERSION_CHIP.
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const sidebarLogo = document.querySelector('.sidebar-logo');
|
|
if (!sidebarLogo) return;
|
|
|
|
// The logo <img> sits inside Quarto's <a class="sidebar-logo-link"> wrapper.
|
|
// Inserting our subtitle as a sibling of the <img> would nest the subtitle's
|
|
// link INSIDE that anchor — invalid HTML, so the browser fires the outer logo
|
|
// link (./index.html) instead of navigating to the textbook. Insert AFTER the
|
|
// logo anchor, as a child of .sidebar-header, so our links are not nested.
|
|
const logoLink = sidebarLogo.closest('.sidebar-logo-link') || sidebarLogo;
|
|
const anchorHost = logoLink.parentElement;
|
|
|
|
// 1. Existing subtitle — what TinyTorch IS in relation to the textbook.
|
|
const subtitle = document.createElement('div');
|
|
subtitle.className = 'sidebar-subtitle';
|
|
subtitle.innerHTML = 'A Build-It-Yourself Companion to the<br><a href="https://mlsysbook.ai" style="color: #D4740C; text-decoration: none;">Machine Learning Systems</a> textbook';
|
|
anchorHost.insertBefore(subtitle, logoLink.nextSibling);
|
|
|
|
// 2. Framework version chip — explicitly identifies TinyTorch's version,
|
|
// not the textbook's. Visually separated so the reader does not parse
|
|
// the version as part of the subtitle prose. Click → GitHub Releases
|
|
// filtered for tinytorch tags (the canonical changelog destination).
|
|
const chipWrap = document.createElement('div');
|
|
chipWrap.className = 'tinytorch-version-chip-wrap';
|
|
|
|
const chip = document.createElement('a');
|
|
chip.className = 'tinytorch-version-chip';
|
|
chip.href = 'https://github.com/harvard-edge/cs249r_book/releases?q=tinytorch';
|
|
chip.target = '_blank';
|
|
chip.rel = 'noopener';
|
|
chip.innerHTML = '🔥 TinyTorch v0.1.13 →'; // TINYTORCH_VERSION_CHIP
|
|
|
|
chipWrap.appendChild(chip);
|
|
subtitle.parentNode.insertBefore(chipWrap, subtitle.nextSibling);
|
|
});
|
|
</script>
|
|
<style>
|
|
.sidebar-subtitle {
|
|
text-align: center;
|
|
font-size: 0.8rem;
|
|
color: #6b7280;
|
|
line-height: 1.4;
|
|
padding: 0 1rem 0.5rem 1rem;
|
|
margin-top: 0.5rem;
|
|
}
|
|
.sidebar-subtitle a:hover {
|
|
color: #f97316 !important;
|
|
}
|
|
|
|
/* Version chip — divider above + amber pill anchored to TinyTorch brand */
|
|
.tinytorch-version-chip-wrap {
|
|
text-align: center;
|
|
margin: 0 1rem;
|
|
padding: 0.5rem 0 0.75rem;
|
|
border-top: 1px solid #e5e7eb;
|
|
}
|
|
.tinytorch-version-chip {
|
|
display: inline-block;
|
|
padding: 0.15rem 0.65rem;
|
|
border: 1px solid #D4740C;
|
|
border-radius: 999px;
|
|
background: rgba(212, 116, 12, 0.08);
|
|
color: #D4740C !important; /* override Quarto's default link color */
|
|
font-size: 0.72rem;
|
|
font-weight: 600;
|
|
text-decoration: none !important;
|
|
white-space: nowrap;
|
|
letter-spacing: 0.01em;
|
|
transition: background-color 0.15s ease;
|
|
}
|
|
.tinytorch-version-chip:hover {
|
|
background: rgba(212, 116, 12, 0.18);
|
|
color: #D4740C !important;
|
|
text-decoration: none;
|
|
}
|
|
|
|
/* Dark-mode overrides — brighter amber to match dark-mode.scss $accent */
|
|
[data-bs-theme="dark"] .tinytorch-version-chip-wrap {
|
|
border-top-color: #454d55;
|
|
}
|
|
[data-bs-theme="dark"] .tinytorch-version-chip {
|
|
border-color: #F59E0B;
|
|
color: #F59E0B !important;
|
|
background: rgba(245, 158, 11, 0.1);
|
|
}
|
|
[data-bs-theme="dark"] .tinytorch-version-chip:hover {
|
|
background: rgba(245, 158, 11, 0.2);
|
|
color: #F59E0B !important;
|
|
}
|
|
</style>
|