mirror of
https://github.com/kevinveenbirkenbach/computer-playbook.git
synced 2026-11-09 20:26:33 +00:00
kevinveenbirkenbachandClaude Opus 5
faadf5b850
sys-front-inj-design now renders templates/css/app.css.j2 ahead of the role's stylesheet and templates/js/design.js.j2 ahead of its script. The branding URLs, the slot dimensions and the logo guard live there instead of being repeated per role: the guard that stood in 41 sheets is one condition in the composing template, and a sheet reads branding through --design-url-* / --design-slot-* custom properties. 29 stylesheets and 43 design scripts lose their Jinja and move to static files. Roles whose sheet carries app-specific URLs declare them as design_css_urls and read them as --design-url-app-*. The script prelude is prepended only when the role script references it, and it carries urls only while a logo is configured, so every role that needs neither is emitted byte for byte as before. Five checks keep the mechanism honest: a composed sheet may only read design custom properties that app.css.j2 declares for its role, a template may not carry Jinja expression text outside its delimiters, a design script may not quote its config object, and the injected-script parse check now covers the design channel. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
28 lines
906 B
CSS
28 lines
906 B
CSS
:root {
|
|
--color-background: var(--design-surface-1);
|
|
--color-foreground: var(--design-text);
|
|
--color-muted: var(--design-surface-3);
|
|
--color-muted-foreground: var(--design-text-muted);
|
|
--color-accent: var(--design-surface-hover);
|
|
--color-accent-foreground: var(--design-text);
|
|
--color-primary: var(--design-primary);
|
|
--color-border: var(--design-border);
|
|
--color-input: var(--design-border-strong);
|
|
--color-ring: var(--design-link);
|
|
--color-gray-200: var(--design-border);
|
|
--color-neutral-800: var(--design-border);
|
|
--color-slate-700: var(--design-surface-active);
|
|
}
|
|
#content a:not(.toc-backref, .headerlink, .toctree-wrapper a, .contents a) {
|
|
color: var(--design-link);
|
|
}
|
|
#left-sidebar a.current {
|
|
background-color: var(--design-surface-active);
|
|
}
|
|
.tooltipped-n::before {
|
|
border-top-color: var(--design-surface-3);
|
|
}
|
|
img.toggler {
|
|
filter: invert(var(--design-invert));
|
|
}
|