synops/tools/synops-render/src/templates/about.html
vegard 17e35b2644 Implementer synops-render CLI-verktøy (oppgave 21.3)
Nytt CLI-verktøy som rendrer artikler og forsider til HTML via
Tera-templates og lagrer resultatet i CAS. Erstatter rendering-logikken
i maskinrommet/src/publishing.rs som standalone verktøy.

Støtter to render-typer:
- article: Rendrer enkeltartikkel med SEO-metadata, presentasjonselementer,
  TipTap→HTML-konvertering, og tema-basert CSS.
- index: Rendrer forside med hero/featured/stream-artikler.

Fire innebygde temaer: avis, magasin, blogg, tidsskrift.
Templates er kopiert fra maskinrommet og innebygd via include_str!().
TipTap-modulen er duplisert inntil synops-common (21.16) samler felles kode.

Følger eksisterende CLI-mønster: --write gater DB-oppdateringer,
JSON til stdout, stderr for logging.

16 enhetstester dekker CSS-variabler, SEO, kategorisering, rendering
og TipTap-konvertering. Verifisert mot produksjons-DB.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-18 09:19:02 +00:00

54 lines
1.4 KiB
HTML

{% extends "base.html" %}
{% block title %}Om — {{ collection_title }}{% endblock %}
{% block extra_css %}
.about-page {
max-width: var(--layout-max-width);
margin: 2rem auto;
padding: 0 1rem;
}
.about-page__content {
font-size: 1.05rem;
line-height: 1.8;
}
.about-page__content h1,
.about-page__content h2,
.about-page__content h3 {
font-family: var(--font-heading);
color: var(--color-primary);
margin-top: 2rem;
margin-bottom: 0.75rem;
line-height: 1.3;
}
.about-page__content h1 { font-size: 2rem; }
.about-page__content h2 { font-size: 1.5rem; }
.about-page__content h3 { font-size: 1.25rem; }
.about-page__content p { margin-bottom: 1rem; }
.about-page__content blockquote {
border-left: 3px solid var(--color-accent);
padding-left: 1rem;
margin: 1.5rem 0;
color: var(--color-muted);
font-style: italic;
}
.about-page__content ul, .about-page__content ol {
margin: 1rem 0;
padding-left: 1.5rem;
}
.about-page__content li { margin-bottom: 0.5rem; }
.about-page__content img { margin: 1.5rem 0; border-radius: 4px; }
@media (max-width: 768px) {
.about-page__content h1 { font-size: 1.5rem; }
.about-page__content h2 { font-size: 1.25rem; }
.about-page__content { font-size: 1rem; }
}
{% endblock %}
{% block content %}
<div class="about-page">
<div class="about-page__content">
{{ about_html | safe }}
</div>
</div>
{% endblock %}