Skip to content
Menu
OpenD Documentation
Version 0.1
Sign in

Change the site's look from the admin console

The admin console's Appearance page sets the theme of the docs site, the help panel and PDFs, and the template every PDF prints with. Changes apply to every page at once, with no rebuild and no change to the repository.

About this task

The repository can style the site too, with theme and pdf in opend.config.yaml (Theme the site, the panel and PDFs, Choose a PDF template). What you set on the Appearance page loads after the repository's theme and replaces its PDF settings, so it wins. A badge on each card says where the current look comes from: Set here, the repository, or the default.

  1. Open Admin Appearance.
  2. Under Site theme, choose the look and select Save theme.
    • Colour preset: Default (OpenD's emerald, or the repository's own colours), Ocean, Indigo, Violet, Teal, Rose, Amber or Graphite. Each sets an accent and matching neutral greys for the light and the dark scheme, all with AA contrast.
    • Custom accent colour: your brand colour, in place of the preset's. Without a dark-scheme accent, a lighter tint is used in dark mode. Accents need at least 3:1 contrast against the page background; text on buttons picks white or black, whichever reads better.
    • Body font and Heading font: system sans-serif, humanist sans-serif, serif, rounded or monospace, from the fonts on the reader's device. No web fonts are loaded.
    • Corners (square, default or round), Reading width (narrow, default, wide or full width) and Colour scheme (follow the reader's system, always light or always dark).
    • Custom CSS: rules loaded last on every page, in the help panel and in PDFs, up to 50,000 characters. Override the --opend-* properties listed in Theme the site, the panel and PDFs, or style the page's classes.

    Pages link the theme as /_site-theme.css, with its version in the address, so browsers fetch the new one at once. Reset the theme goes back to the repository's look.

  3. Under PDF template, choose a template and select Apply template.

    Standard, Report, Compact or Handbook; see Choose a PDF template. Applying a template replaces the PDF settings with its own and keeps your print CSS.

  4. Adjust the PDF settings and select Save PDF settings.

    Page size, font, orientation, margins, text size, cover and cover note, contents, chapter breaks, page numbers, running header and footer, and Print CSS loaded last in every PDF. PDFs also follow the site theme, always in the light scheme. Reset the PDF template goes back to the repository's pdf settings.

  5. Check the result with the links under Check the result: the docs site and each publication's PDF, as you see them.

    Every PDF is printed again after a change, the first time someone downloads it.

Results

Each save is audited as settings.appearance.theme or settings.appearance.pdf. Tools can read and set both with GET and PUT /admin/api/appearance; see Admin API reference.