Templates

The project layout and what each template is responsible for.

On this page

Project structure

text

tartarus/
├── assets/
│   ├── css/
│   │   ├── main.css          design tokens + components
│   │   └── chroma.css        generated syntax colours
│   └── js/
│       ├── main.js           Alpine bootstrap
│       ├── theme-init.js     inline, runs before paint
│       ├── theme.js          light/dark/system store
│       ├── search.js         command palette
│       ├── pagefind.js       lazy loader for the index
│       ├── toc.js            IntersectionObserver scroll spy
│       └── ui.js             copy button, tabs, drawer
├── content/docs/
├── layouts/
│   ├── baseof.html
│   ├── home.html
│   ├── single.html
│   ├── list.html
│   ├── 404.html
│   ├── _markup/              render hooks
│   ├── partials/
│   └── shortcodes/
├── scripts/gen-chroma.sh
├── hugo.toml
└── package.json

Layouts

Template	Renders
`baseof.html`	Document shell, navbar, footer, dialogs
`home.html`	Landing page
`single.html`	A documentation page
`list.html`	A section overview
`404.html`	Not-found page

single.html and list.html are one line each — both delegate to partials/docs-layout.html, which owns the three-pane layout.

Partials

Partial	Responsibility
`head.html`	Metadata, asset pipeline, theme bootstrap
`head-extra.html`	Empty by design — your extension point
`navbar.html`	Logo, menu, search trigger, social, theme control
`sidebar.html`	Resolves the section to render
`sidebar-tree.html`	Recursive navigation tree
`toc.html`	Table of contents from heading fragments
`breadcrumb.html`	Ancestor trail
`pagination.html`	Previous/next in reading order
`docs-order.html`	Flattens a section into reading order
`edit-link.html`	Repository edit URL
`search.html`	Search dialog
`mobile-nav.html`	Navigation drawer
`theme-toggle.html`	Theme dropdown
`child-pages.html`	Section index cards
`icon.html`	SVG icon wrapper

Render hooks

Hook	Adds
`render-heading.html`	`id` and an anchor link
`render-codeblock.html`	Language label, copy button, Chroma highlighting
`render-link.html`	`target="_blank"` and an icon for external links
`render-image.html`	Page-resource resolution and lazy loading

JavaScript boundaries

Alpine components are registered in main.js and stay small:

Component	State
`ttSearch`	Query, results, selected index
`ttTabs`	Active tab
`ttCopy`	Copied flag
`ttDrawer`	Show/hide the drawer
`$store.theme`	Theme mode

Anything that can be computed at build time is not in this table.

Edit this page