engineering/remarkbox
1
0
Fork 0
Code Issues 3 Pull requests 1 Projects Releases Packages Wiki Activity Actions
remarkbox/docs/tickets/16.md

2.6 KiB
Raw Permalink Blame History

T16 — Themes must be self-contained; common.css is the built-in (embed) stylesheet

Status: open Priority: medium Source: fox directive 2026-05-12 (after chaostheory palette leaked into meta via common.css, fixed in 89679fd + theme 37c496f)

Problem

Every base template — base.j2, meta-base.j2, chaostheory-base.j2 — includes snippets/stylesheet-includes.j2, which loads /static/css/common.css. So a meta page and a chaostheory page both pull the same shared stylesheet. When common.css carries palette or visual assumptions (as it did after 68ca0ef), those bleed into every theme. A meta page should load only meta CSS; a chaostheory page should load only chaostheory CSS.

The intent: common.css (+ embed.css) is the "built in" — the styling for embed mode and unthemed namespaces (base.j2). Full themes are standalone (their base templates already "extend nothing"); they should ship a complete stylesheet and not piggyback on the built-in.

Why it's not a one-line change

The themes are not currently self-contained. They depend on behavioral CSS in common.css, e.g. chaostheory's theme.css notes "Reply form inside node — display:none owned by common.css". Ripping common.css out of the themed templates today would break reply-form toggles, the burger/phone menu, alerts, node action rows, etc.

Plan

  1. Inventory which common.css rules each theme actually relies on (behavioral: display:none toggles, .toggle-open, burger menu, AJAX states; structural: .node, .remark-box-div; visual: alerts, wells, .question-mark-circle).
  2. Move the rules each theme needs into that theme's own CSS (meta.css, remarkbox-theme-chaostheory/theme.css). Keep them theme-local.
  3. Split stylesheet-includes.j2 (or add a theme_stylesheet_includes block) so meta-base.j2 / chaostheory-base.j2 load only pygments.css, dynamic-remarkbox.css, the per-namespace stylesheet, and their own theme CSS — not common.css.
  4. base.j2 keeps common.css; common.css + embed.css become the documented "built-in / embed" stylesheet. Add a header comment to common.css saying so.
  5. Regression-check: embed mode, default (unthemed) namespace, meta (meta.remarkbox.com, faq.remarkbox.com), chaostheory (foxhop.net), light + dark mode, reply-form toggle, burger menu, flash alerts, ? help circles.

Done when

Loading a meta page pulls zero chaostheory CSS and zero chaostheory-flavored rules from common.css, and vice versa; embed/default still styled by common.css; all regression points above verified.