page.html| Commit | Message |
|---|---|
ac75fabf3 | 2021-08-10 Jekyll site migration |
page.html → default.html → outputs full HTML. The layout: default front matter (line 2) means this layout wraps its output INSIDE the default layout. The default layout provides <html>, <head>, navbar include, footer include, and script includes.{% if page.width == 'expand' %} <!-- Full-width, no container -->
{{ content }} <!-- Raw content, no wrapper -->
{% else %}
<div class="uk-section"> <!-- Standard UIkit section wrapper -->
<div class="uk-container{% if page.width %} uk-container-{{page.width}}{% endif %}">
<article class="uk-article">
<h1 class="uk-article-title">{{ page.title | escape }}</h1>
<div class="article-content link-primary">
{{ content }}
</div>
</article>
</div>
</div>
{% endif %}<article> (line 11): The use of the HTML5 <article> element indicates that each page is considered a self-contained composition — good for SEO and accessibility. The .uk-article class is themed by article.scss (#4029) for typography.
link-primary (line 15): This custom class on the content wrapper makes all links inside use the primary color. In the ProjectForge brand SCSS (projectforge.scss #3945), this is overridden to #BF4040 (ProjectForge red). Without this class, links inside article content would use UIkit's default blue.
{{ page.title | escape }} (line 13): The | escape Liquid filter prevents XSS — if a page title somehow contains HTML/JS, it's escaped rather than rendered. Defense-in-depth for content that comes from Markdown/AsciiDoc front matter.
page.html. Changes here affect the majority of the site.{{ content }}. Use with caution; the page must provide its own layout.link-primary is the brand trigger: The class that activates ProjectForge's red link color (#BF4040). Without it, links stay UIkit default blue.default.html. The layout system is a composition chain.
Pages set their width via front matter:
.uk-containerwidth: small.uk-container-smallwidth: large.uk-container-largewidth: expandThe
expandmode is special — it bypasses the entire section/article wrapper and outputs raw{{ content }}directly. This is used for pages that need full viewport width control (custom hero sections, landing pages).