Rookery - Theming a rookery

Each key can also be passed as a parameter directly to the rookery function, with will take precedence over the theme dictionary:

Every value is either a Typst color or a raw CSS string. Rookery allows a string so that you can specify rgba(...), color-mix(...), var(--your-own) and anything else CSS accepts valid.

[idea:theme-reference]

Theme reference

Key	Default	What it sets
`link-color`	`rgba(128, 0, 255, .12)`	The hover background on any rookery link, and the fallback `border-color` takes when you leave it unset.
`fold-color`	`rgba(0, 100, 255, .05)`	The hover background on a foldable window block.
`id-color`	`gray`	The `[idea:etal]` ID’s own text.
`date-color`	`gray`	An idea’s or a window’s date, where it is shown.
`border-color`	`link-color`	The left rule that an idea, a window and an outline all carry.
`rule-width`	`2px`	How thick that rule is. The card’s corner is arithmetic against it, so the tab the ID straddles stays shut when you move it.
`pad`	`0.5em`	The padding every rookery block measures from—an idea’s box, a window’s, and the indent a nested one takes.
`label-font`	`monospace`	The face the `[idea:etal]` ID is set in, and the outline’s ‘Contents’ title with it. Both are machinery rather than writing, so both leave the prose face behind.
`label-size`	`0.57rem`	The size of that ID. Load-bearing beyond the label: the tab’s lift, a window’s summary and the footer’s padding are all measured against it, so the corner closes at whatever size you choose. `rem` rather than `em`, so it does not shrink again inside a window.
`tags-color`	`(:)`	One color, or a `(text:, background:)` pair, per tag—delivered as a rule on `.idea-tag-<tag>` so it reaches the pill, the outline row’s marker and a search result’s chip alike.

[idea:class-reference]

HTML class reference

You can also style more granularly with your own CSS using the classes below. A trailing * below stands for a family whose members are named in the description.

Class	What it is
`.idea-box`	An idea’s own block where it was written, carrying the left rule and the padding every rookery block nested inside it measures from.
`.idea-head`, `.idea-tab`	The heading group, and the short top rule the ID straddles at the card’s corner.
`.idea`, `.idea-title`	The idea’s heading element—which carries the anchor an `@idea:etal` fragment resolves to—and the title text inside it.
`.idea-label`, `.idea-date`	The `[idea:etal]` permalink and the date beside it, in a heading, a window summary or prose, wherever either is shown.
`.idea-tag`, `.idea-tag-<tag>`	A tag pill in the hat, and one extra class per tag the idea carries. The second reaches every surface that names the tag—the idea’s heading, its box, its outline row, its pill, and a search result’s chip, which JavaScript builds in the browser—so a single rule of your own styles a tag everywhere it shows up.
`.idea-ref`	An `@idea:other` reference in prose. See referencing ideas.
`.idea-window`	A transclusion, wearing the same rule and indent as `.idea-box`; the second class `.idea-window-plain` opts a bare `#idea-body` out of that box.
`.idea-window-*`	The fold: `-details` the `<details>`, `-summary` the row you click, `-title` and `-date` the two things in that row, `-body` what folds away under it.
`.idea-outline*`	A page’s outline: `.idea-outline` the list at each level of nesting, `-title` its “Contents” label, `-row` one row per idea.
`.idea-footnote*`	An idea’s own footnotes, carried on every surface it appears on: `.idea-footnotes` the block, `-title` its label, `.idea-footnote-list` and `.idea-footnote` its entries.
`.idea-fn-*`	`-ref` the superscript mark in prose, `-backlink` the way back up to it from the entry.
`.idea-references`, `.idea-page-refs`	The bibliography an idea’s citations draw from, and the page’s own for citations written outside any idea.
`.idea-footer*`	On an idea page: `.idea-footer` the ruled-off apparatus under the note, `-title` the label on each of its sections.
`.idea-context`, `.idea-backlinks`	That footer’s two sections: where the note was written, and the notes pointing at it.
`.idea-page-list`, `.idea-page-row`	A list of pages in either section, and one row in it—a page cannot fold, so it wears a window’s shape without being one.

[idea:css-reference]

CSS variable reference

You can override any value from the theme reference as a CSS variable, as well as other aspects of a rookery’s appearance.

Property	Default	What it sets
`--idea-tag-size`	`--idea-label-size`	A tag pill’s font size. Follows the ID’s size unless you separate them.
`--idea-tag-radius`	`999px`	A pill’s corner radius.
`--idea-tag-color`, `--idea-tag-bg`	`--idea-id-color`, `rgba(128, 128, 128, .18)`	An untagged-by-`tags-color` pill’s text and background. Setting `tags-color` writes these per tag for you.
`--idea-tag-line`	`--idea-border-color`	The tick an outline row draws off the outline’s rule, where the row’s idea carries a tag.
`--idea-external-color`	`--idea-id-color`	The underline an outbound link takes on hover, in a references block or an idea page’s footer—so a link that leaves your rookery reads differently from one that stays in it.

Parameter	Default	What it sets
`prefix`	`"idea"`	The namespace an idea’s ID lives in; non-empty, no `:` (the separator is added for you). See referencing ideas.
`window-depth`	`0`	How many levels of transclusion are allowed before a window bottoms out as a link to the idea’s own page. `0` allows none. See controlling window depth.
`theme`	`(:)`	The five colors the package will style for you; each key is also a parameter in its own right, and the granular form wins. See theming a rookery.
`idea-page-template`	`none`	Your own chrome for the standalone page rookery mints per idea. See idea template.
`bibliography`	`none`	Typst’s own `#bibliography` arguments, for the single bibliography a rookery’s citations all draw from.
`index-page`	`true`	Whether to mint `ideas/index.html`, a landing page listing every idea in the rookery. Set it to `false` where your site already publishes an index of its own.
`refs`	`true`	Whether rookery installs the `show ref:` rule that renders `@idea:etal` as the idea rather than a figure number. Set it to `false` to keep Typst’s own behaviour, or to install a rule of your own. See hyperlinks.
`ref-target`	`"page"`	Where every `@idea:etal` in the document lands: `"page"` on the idea’s standalone page, `"anchor"` in the context it was hatched in. Ignored when `refs` is `false`. See hyperlinks.
`syndicate`	`false`	Whether each minted page also carries an `<rssfeed:item>` beacon, so a feed package can collect your ideas without either package importing the other. Off by default: a package should not write into another’s label namespace unasked. An idea with no date never gets one.