mirror of
https://github.com/harvard-edge/cs249r_book.git
synced 2026-03-11 17:49:25 -05:00
Merge feature/tinytorch-core: site improvements, PDF build fixes, minor cleanups
This commit is contained in:
@@ -29,6 +29,9 @@ serve: clean html
|
||||
pdf:
|
||||
@echo "🔥 Building Tiny🔥Torch PDF via XeLaTeX..."
|
||||
@echo ""
|
||||
@# PDF build needs Mermaid CLI (for diagrams). Config uses npx; Node.js must be installed.
|
||||
@command -v npx >/dev/null 2>&1 || { echo "❌ Error: npx not found. PDF build requires Node.js (for Mermaid diagrams). Install from https://nodejs.org/ or run: brew install node"; exit 1; }
|
||||
@echo "✅ Mermaid CLI (via npx) available"
|
||||
@# Step 1: Generate LaTeX (matches CI workflow)
|
||||
@echo "📚 Generating LaTeX files..."
|
||||
jupyter-book build . --builder latex --config _config_pdf.yml --toc _toc_pdf.yml
|
||||
|
||||
@@ -51,6 +51,8 @@ sphinx:
|
||||
- sphinxcontrib.mermaid
|
||||
config:
|
||||
mermaid_version: "10.6.1"
|
||||
# Use npx so PDF build works without global mermaid-cli (requires Node.js)
|
||||
mermaid_cmd: "npx -y @mermaid-js/mermaid-cli"
|
||||
# Render mermaid as PDF for LaTeX
|
||||
# --pdfFit scales PDF to fit the diagram (not full page)
|
||||
# --scale 1.0 keeps diagrams at natural size (1.5 was too large for tall diagrams)
|
||||
@@ -172,6 +174,13 @@ sphinx:
|
||||
\newunicodechar{ω}{$\omega$}
|
||||
\newunicodechar{✓}{\checkmark}
|
||||
\newunicodechar{✗}{$\times$}
|
||||
% Box-drawing (terminal/code art) - TeX Gyre Cursor has no Unicode box glyphs
|
||||
\newunicodechar{═}{\texttt{=}}
|
||||
\newunicodechar{║}{\texttt{|}}
|
||||
\newunicodechar{╔}{\texttt{+}}
|
||||
\newunicodechar{╗}{\texttt{+}}
|
||||
\newunicodechar{╚}{\texttt{+}}
|
||||
\newunicodechar{╝}{\texttt{+}}
|
||||
|
||||
% Syntax-highlighted code blocks with refined colors
|
||||
\usepackage{listings}
|
||||
|
||||
@@ -384,14 +384,16 @@ pre.mermaid {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 1.2rem;
|
||||
font-weight: 600;
|
||||
color: #f59e0b;
|
||||
text-decoration: none;
|
||||
font-weight: 700;
|
||||
color: #fbbf24 !important;
|
||||
text-decoration: none !important;
|
||||
letter-spacing: -0.01em;
|
||||
text-shadow: 0 0 12px rgba(251, 191, 36, 0.3);
|
||||
}
|
||||
|
||||
.tinytorch-bar-brand:hover {
|
||||
color: #fbbf24;
|
||||
color: #fde68a !important;
|
||||
text-shadow: 0 0 16px rgba(251, 191, 36, 0.45);
|
||||
}
|
||||
|
||||
.tinytorch-bar-brand .brand-fire {
|
||||
@@ -485,26 +487,41 @@ pre.mermaid {
|
||||
background: rgba(249, 115, 22, 0.15);
|
||||
}
|
||||
|
||||
/* Responsive: hide text on small screens, keep icons */
|
||||
/* ── Responsive: progressive disclosure across breakpoints ── */
|
||||
|
||||
/* Tablet landscape / small desktop — drop date from version, shrink link padding */
|
||||
@media (max-width: 1024px) {
|
||||
.tinytorch-bar-version .version-date {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tinytorch-bar-links a {
|
||||
padding: 0.5rem 0.7rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Tablet portrait — icons only, shrink badge, ensure 44px touch targets */
|
||||
@media (max-width: 768px) {
|
||||
.tinytorch-bar-links .link-text {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tinytorch-bar-links a {
|
||||
padding: 0.5rem;
|
||||
min-width: 44px;
|
||||
min-height: 44px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.tinytorch-bar-links .link-icon {
|
||||
font-size: 1.1rem;
|
||||
font-size: 1.15rem;
|
||||
}
|
||||
|
||||
.tinytorch-bar-badge {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tinytorch-bar-version {
|
||||
display: none;
|
||||
font-size: 0.65rem;
|
||||
padding: 0.2rem 0.5rem;
|
||||
}
|
||||
|
||||
.tinytorch-bar-left {
|
||||
@@ -516,23 +533,42 @@ pre.mermaid {
|
||||
}
|
||||
|
||||
.tinytorch-bar {
|
||||
height: 44px;
|
||||
height: 48px;
|
||||
}
|
||||
|
||||
/* Keep download link visible but compact on mobile */
|
||||
.tinytorch-bar-links a.download-link {
|
||||
padding: 0.4rem 0.6rem;
|
||||
.tinytorch-bar-links {
|
||||
gap: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* Extra small screens - minimal spacing */
|
||||
@media (max-width: 480px) {
|
||||
.tinytorch-bar-links {
|
||||
gap: 0.1rem;
|
||||
/* Phone — hide badge, hide secondary links, keep compact version */
|
||||
@media (max-width: 600px) {
|
||||
.tinytorch-bar-badge {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tinytorch-bar-links a {
|
||||
padding: 0.4rem;
|
||||
.tinytorch-bar-links a.link-secondary {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tinytorch-bar-version {
|
||||
font-size: 0.7rem;
|
||||
padding: 0.2rem 0.5rem;
|
||||
}
|
||||
|
||||
.tinytorch-bar {
|
||||
height: 44px;
|
||||
}
|
||||
|
||||
.tinytorch-bar-brand {
|
||||
font-size: 1.05rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Small phone — hide version too, brand + 3 primary icons */
|
||||
@media (max-width: 420px) {
|
||||
.tinytorch-bar-version {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tinytorch-bar-brand {
|
||||
@@ -584,6 +620,18 @@ header.bd-header {
|
||||
margin-top: 3.5rem !important;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
header.bd-header {
|
||||
margin-top: 2.75rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
header.bd-header {
|
||||
margin-top: 2.5rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* When announcement bar is present, add extra space */
|
||||
body.has-announcement header.bd-header {
|
||||
margin-top: 6rem !important;
|
||||
@@ -593,6 +641,26 @@ body.has-announcement .tinytorch-bar {
|
||||
top: 2.5rem !important;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
body.has-announcement header.bd-header {
|
||||
margin-top: 5rem !important;
|
||||
}
|
||||
|
||||
body.has-announcement .tinytorch-bar {
|
||||
top: 2.25rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
body.has-announcement header.bd-header {
|
||||
margin-top: 4.5rem !important;
|
||||
}
|
||||
|
||||
body.has-announcement .tinytorch-bar {
|
||||
top: 2rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Hide icon links from sidebar completely - only show in top navbar */
|
||||
.bd-sidebar .icon-links,
|
||||
.bd-sidebar .navbar-icon-links,
|
||||
|
||||
@@ -32,8 +32,8 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
<a href="${siteRoot}intro.html" class="tinytorch-bar-brand">
|
||||
Tiny<span class="brand-fire">🔥</span>Torch
|
||||
</a>
|
||||
<a href="https://github.com/harvard-edge/cs249r_book/releases" target="_blank" rel="noopener noreferrer" class="tinytorch-bar-version" title="View releases on GitHub"><span class="version-number">v${TINYTORCH_VERSION}</span><span class="version-date"> · ${TINYTORCH_RELEASE_DATE}</span></a>
|
||||
<span class="tinytorch-bar-badge">Under Construction</span>
|
||||
<a href="https://github.com/harvard-edge/cs249r_book/releases" target="_blank" rel="noopener noreferrer" class="tinytorch-bar-version" title="View releases on GitHub">v${TINYTORCH_VERSION} · ${TINYTORCH_RELEASE_DATE}</a>
|
||||
</div>
|
||||
<div class="tinytorch-bar-links">
|
||||
<a href="${siteRoot}_static/downloads/TinyTorch-Guide.pdf" class="download-link" title="Download Course Guide (PDF)">
|
||||
@@ -44,11 +44,11 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
<span class="link-icon">↗</span>
|
||||
<span class="link-text">Paper</span>
|
||||
</a>
|
||||
<a href="https://mlsysbook.ai" target="_blank">
|
||||
<a href="https://mlsysbook.ai" target="_blank" class="link-secondary">
|
||||
<span class="link-icon">📖</span>
|
||||
<span class="link-text">MLSysBook</span>
|
||||
</a>
|
||||
<a href="#" class="subscribe-trigger" onclick="event.preventDefault(); if(window.openSubscribeModal) openSubscribeModal();">
|
||||
<a href="#" class="subscribe-trigger link-secondary" onclick="event.preventDefault(); if(window.openSubscribeModal) openSubscribeModal();">
|
||||
<span class="link-icon">✉️</span>
|
||||
<span class="link-text">Subscribe</span>
|
||||
</a>
|
||||
@@ -56,7 +56,7 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
<span class="link-icon">⭐</span>
|
||||
<span class="link-text">Star</span>
|
||||
</a>
|
||||
<a href="${siteRoot}community.html" target="_blank">
|
||||
<a href="${siteRoot}community.html" target="_blank" class="link-secondary">
|
||||
<span class="link-icon">🌍</span>
|
||||
<span class="link-text">Community</span>
|
||||
</a>
|
||||
|
||||
@@ -121,6 +121,13 @@ parts:
|
||||
- file: conclusion
|
||||
title: "You Built Something Real"
|
||||
|
||||
# Community (referenced from TITO overview)
|
||||
- caption: Community
|
||||
numbered: false
|
||||
chapters:
|
||||
- file: community
|
||||
title: "Community Guide"
|
||||
|
||||
# Appendix
|
||||
- caption: Appendix
|
||||
numbered: false
|
||||
|
||||
@@ -286,7 +286,7 @@ Benchmark Architecture:
|
||||
│ BenchmarkSuite │
|
||||
│ • Multi-metric comprehensive evaluation │
|
||||
├─────────────────────────────────────────┤
|
||||
│ MLPerf │
|
||||
│ MLPerf │
|
||||
│ • Standardized industry-style benchmarks│
|
||||
└─────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
@@ -65,6 +65,9 @@
|
||||
{ "command": "tinytorch.revealTerminal", "title": "TinyTorch: Reveal Terminal", "icon": "$(terminal)" },
|
||||
{ "command": "tinytorch.rerunCommand", "title": "TinyTorch: Rerun Command" }
|
||||
],
|
||||
"configurationDefaults": {
|
||||
"workbench.tree.indent": 16
|
||||
},
|
||||
"menus": {
|
||||
"view/title": [
|
||||
{ "command": "tinytorch.refreshModules", "when": "view == tinytorch.modules", "group": "navigation" },
|
||||
|
||||
Reference in New Issue
Block a user