cameronbarker.me
Personal site built with Quarto. quarto preview runs a local server; quarto render writes the static site to _site/.
Add a blog post
Create posts/<slug>/index.qmd:
posts/_metadata.yml sets the code style and title banner for every post.
Add a publication
Copy an existing folder in publications/ and edit its front matter. publications/_metadata.yml adds the shared header template and publication.css.
| Field | Use |
|---|---|
title |
Title in the listing and browser tab. |
publication-display-title |
Optional. Title on the paper page, may contain <br>. |
authors |
Plain list for the listing. Bold your own name. |
format: html: authors: |
Same list with affiliation superscripts, for the paper page. |
publication-affiliations |
One line per affiliation, e.g. "^1^ University of Edinburgh". |
contribution-note |
Optional, e.g. "∗ Equal contribution". |
venue-status |
"[ICML 2026]{.publication-venue}" once accepted, else "Under review" or "Preprint". |
venue-track |
Optional track name under the venue. |
year |
Venue year, or manuscript year if unpublished. |
date |
Full date. Sorts the listing; shown as “Posted”. |
Page body building blocks:
::: {.publication-links}…:::is the centred links box under the header.[Read the paper](url){.publication-paper-link}is a filled button.{.invert-dark}inverts a white-background figure in dark mode.- For a figure with separate light and dark files, copy the
<figure>block inpublications/lurch/index.qmd. - Figures and videos on paper pages sit on a card. A figure file with its own background must use the card colour:
#FFFFFF(light) or#1D2022(dark).
Edit home page highlights
The Highlights section in index.qmd contains three clickable cards, styled in home.css. Copy a highlight-card link to add another: set its href to a publication, blog post, or project page, then update the title, footer metadata and SVG diagram. Give each title a unique ID and match its card’s aria-labelledby to that ID. The inline diagrams use the site’s palette and adapt to light and dark mode. Keep the profile content inside #profile so highlights stay below it at full width.
Update the CV
Replace cv.pdf with the latest CV. The home page’s Links section shows it as a full-width “View CV (PDF)” button above the four profile/contact links, and Quarto copies it into the rendered site.
Colour roles
Use the same roles in light and dark mode; the theme files supply the colours.
- Blue (
--ca-primary): links, primary actions, hover/focus and active navigation, plus the navbar brand dot, bold-italic biography emphasis and the main strokes in homepage infographics. - Green (
--ca-result/--ca-pine): confirmed venues in publication headers and the publications listing. Wrap accepted venues in[Venue year]{.publication-venue}in front matter. Homepage card metadata stays neutral. In the ALEM infographic, green distinguishes the dotted communication paths (.highlight-communication). - Purple (
--ca-computation/--ca-plum): inline code and code keywords/functions; small infographic details (.highlight-detail), such as KLA observations and ALEM task blocks. - Neutrals: headings, metadata labels, dates, pending statuses, card surfaces, borders and grids. Prefer weight and spacing for general emphasis.
Use accents on small details, not entire cards or sections. Research figures, posters and videos retain their own legend-driven colours; their surrounding cards use the shared neutral palette. Syntax highlighting uses purple sparingly, muted comments and neutral values, preserving explicit error/alert styling.
Files
| File | Contents |
|---|---|
_quarto.yml |
Site settings, navbar, theme list. |
typography.scss |
Fonts and type sizes. |
layout.scss |
Navbar and page grid. |
light.scss, dark.scss |
Carbon / Atlantic palette for each appearance, as Bootstrap variables and --ca-* custom properties. dark.scss also holds .invert-dark. |
carbon.scss |
Shared styling that reads the --ca-* colours: navbar, section headings, code blocks. |
home.css |
Home page (index.qmd) only. |
listing.css |
Blog and Publications index pages. |
fonts/ |
Self-hosted font files and licences. |
Hosting
.github/workflows/gh-pages.yml renders and publishes to the gh-pages branch on each push to main. All internal links are relative, so _site/ also works when served from any directory by a plain web server.