[en] Theme assets

[en] Everything in the theme's assets/ folder is published with the site: stylesheets, scripts, images and fonts. To link to an asset, use the asset() function with the file's path inside assets/:

<link rel="stylesheet" href="{{ asset('css/main.css') }}">
<script src="{{ asset('js/theme.js') }}" defer></script>
<img src="{{ asset('img/logo.svg') }}" alt="">

[en] Always use asset() rather than writing the path yourself. Pages are published in a folder per language, and asset() gives the path that works from every page. A path containing .. is rejected.

[en] Inside a stylesheet, link to other assets with paths relative to the stylesheet, as usual:

@font-face {
    font-family: "Inter";
    src: url("../fonts/inter.woff2") format("woff2");
}

[en] Fonts must be in WOFF2 format. Images can be SVG, PNG, JPG, WebP or ICO.

[en] The stylesheet for your content itself, which styles the tables, admonitions, code blocks and other elements in page.content, comes from Paligo and is added by paligo.head. Your theme's stylesheets are loaded alongside it, so you can change any of its styles.

[en] For the class names in your content, such as admonitions, tables and code blocks, see [en] Start from Paligo Base.