name

add-style-topics

description

Stylesheets written as topics, so a user's AI can make a new look

spec

style-topics

status

archived

date

2026-09-24

tags

ai, spec, openspec, change

Proposal

Why

The two built-in stylesheets were the only looks d2 had, and changing one meant changing code. A user should be able to ask their AI for a new look (colours, fonts, the logo text) and get it without an install or a deploy.

What Changes

• New topic category Style: a stylesheet written as a topic, through the ordinary topics API.
• brand in its frontmatter replaces the logo text on every page.
• The save reply checks it (style: {ok, errors}); a broken one is listed with its errors and can't be picked.
• Help gets "Make your own stylesheet"; the diesel2 skill gets "Make a stylesheet".

Impact

• Affected specs: style-topics (new).
• Affected code: src/styles.ts, src/stylespage.ts, the top bar, the topics API.

Tasks

1. Build

• 1.1 Parse and check Style topics
• 1.2 List them on the Styles page, broken ones with their errors
• 1.3 Apply brand in the top bar and on the landing page
• 1.4 Report style: {ok, errors} on save

2. Document

• 2.1 Help: Make your own stylesheet
• 2.2 Skill:diesel2: Make a stylesheet
• 2.3 Try it end to end: Style:yahoo

Design

• A broken Style topic is stored anyway and never applied, so a mistake can't break a page.
• The choice stays in the d2style cookie, now holding the topic id (Style:yahoo), until real login brings user preferences.

Spec delta

ADDED Requirements

Requirement: Stylesheets as topics

The system SHALL accept a stylesheet written as a topic in category Style, through the ordinary topics API.

Scenario: AI makes a stylesheet

• WHEN the user's AI saves Style:yahoo with valid tokens and brand: YAHOO
• THEN the save reply has style: {ok: true}
• AND the stylesheet is listed under Style topics on the Styles page

Requirement: Logo text

The system SHALL show a Style topic's brand as the logo text on every page while that stylesheet is in use.

Scenario: Picking a branded stylesheet

• WHEN the user picks Style:yahoo on the Styles page
• THEN every page shows YAHOO next to the logo

Requirement: Broken stylesheets are harmless

The system MUST NOT apply a Style topic that has errors; it SHALL list it with its errors instead.

Scenario: Unknown token

• WHEN a Style topic sets a token that doesn't exist
• THEN the save reply lists the error
• AND the Styles page shows the topic as "Has errors" with no button to use it

Scenario: A broken stylesheet in the cookie

• WHEN the browser's cookie names a Style topic that has errors
• THEN pages use the default stylesheet