plugins/moody-s/skills/shared/template/SKILL.md
Canonical rules and HTML/CSS contract for page chrome (head boilerplate, cover, table of contents, section block, sources-section wrapper, footer, outlook-badge, and design tokens) used across Moody's Agentic Solutions HTML report skills (earnings-call-summary, peer-analysis, public-information-book, sector-analysis). Sibling of `skills/shared/citations/` using the same inlining pattern. Parent skills must read BOTH this `SKILL.md` (owned classes/snippets, per-skill overrides, outlook-badge usage) AND `assets/template.html` (canonical CSS + HTML markup snippets) before emitting any HTML report. Asset file is the single source of truth for visual/markup; this `SKILL.md` is the single source of truth for authoring rules. Triggers when the user asks about the template, page chrome, cover, table of contents, footer, layout, design tokens, color palette, fonts, outlook badges, or anything affecting the visual scaffolding of an HTML report skill.
npx skillsauth add openai/plugins templateInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
This is the single source of truth for the visual chrome of every HTML report produced by
the parent skills earnings-brief, peer-analysis, issuer-brief, and
sector-brief. It owns:
--navy, --accent, --gray-* / --g*, --text, --positive, --negative,
--neutral).body { font-size: 13px } and
.page { max-width: 900px }; ECS / SA inherit them as-is, PA overrides max-width to
1050px, and PIB overrides both (font-size: 12.5px, max-width: 920px).cover-simple for PIB / SA; cover-multi for ECS / PA)..toc-page, .toc-heading, .toc-list, .toc-num, .toc-label, .toc-dots)..section, .section-heading, .section-content and its descendants)..outlook-badge (stable / positive / negative / review / na)..report-footer, .footer-logo).The canonical CSS and the literal HTML markup contracts live in
assets/template.html. This SKILL.md describes the rules; the asset
file ships the verbatim implementation. Parent skills must read both files before emitting.
Read this skill from a parent skill before emitting any HTML report. Parent skills must
contain a directive near the top of their SKILL.md instructing the agent to read both
this file and assets/template.html. The pairing is identical to the skills/shared/citations/
contract — every HTML report touches both shared skills.
Whenever the agent is about to author CSS, an HTML scaffold, a class name, a design token, or any visual chrome that the parent skill does not itself define, it must consult this shared template skill first and only fall back to inventing markup if the shared layer also does not cover the need. Do not silently restyle anything the shared skill owns; do not invent CSS or HTML scaffolding for elements the shared skill already provides.
<style id="shared-template-css"> from
assets/template.html between the /* BEGIN shared-template-css ... */ and
/* END shared-template-css */ CSS-comment markers in the parent template's <style>
block. Parent templates ship only the marker comments; they never duplicate the rules.<template> snippet for
the document head, cover (one of cover-simple / cover-multi), TOC, section block,
sources-section wrapper, and footer. Class names and attribute order are invariant.<style> block — never inside it, and never as duplicated copies
of shared rules.document-head)The shared document-head snippet is the literal contract for the top of the parent template:
<!DOCTYPE html>, the <html> / <head> / <meta> / <title> boilerplate, and the
<style> block that contains:
/* BEGIN shared-template-css ... */ marker region./* BEGIN shared-citations-css ... */ marker region.Then <body> opens with <div class="page">, which wraps the cover, TOC, report body, and
footer. Substitute {report_title}.
cover-simple and cover-multi)Two variants. Each parent skill uses exactly one:
| variant | used by | shape |
|---------------|------------------------------------------|--------------------------------------------------|
| cover-simple| issuer-brief, sector-brief | 1-column navy cover, top "logo + title" / bottom .cover-meta. |
| cover-multi | earnings-brief, peer-analysis | 2-region grid: .cover-top with navy .cover-left + optional .cover-strip image + .cover-bar-top; .cover-bottom is an optional landscape band. |
Cover-multi rules:
has-cover-image class to .cover-top and/or .cover-bottom only when an <img>
is populated in .cover-strip / .cover-landscape. Without the class, the strip and bar
are hidden by the canonical CSS..cover-companies lists per-skill chips. PA marks the target entity with
class="company-chip target"; ECS lists the issuer first..cover-companies-label text is per-skill (e.g. PEERS, COMPANIES).<img> URLs) is per-skill data; the wrapper classes are shared.Cover-simple rules:
.cover-meta row at the bottom; populate as many <span><strong>Label:</strong> value</span>
pairs as the parent skill needs. PIB always emits Type: Public Information Book.toc-block)The TOC scaffold is identical across all four skills. Each parent fills the <ul class="toc-list">
with one <li> per section it emits, in document order, using the .toc-num / .toc-label /
.toc-dots pattern. The trailing TOC entry always points to the Citations block
(#{prefix}-sources-anchor, label Citations).
section-block)Every titled section in the report body uses the <div class="section" id="{prefix}-section-{slug}">
<div class="section-heading">+<div class="section-content">shape. The body of.section-contentis skill-specific (paragraphs, tables, lists, charts).
The <div id="{prefix}-cite-{slot}"></div> placeholder inside .section-content is opt-in
and only relevant to skills that consume the per-section citation recap from
skills/shared/citations/. Skills that do not opt in omit the placeholder.
sources-section-block)This is the same wrapper that skills/shared/citations/ defines as <template id="sources-section">,
re-shipped here so the document scaffold stays self-contained. The wrapper anchors the TOC link
target via id="{prefix}-sources-anchor" and contains #{prefix}-sources for the rows. The
rows themselves (.source-item) are owned by skills/shared/citations/, not by this skill.
report-footer)The footer is identical across all four skills: navy .report-footer band with the Moody's
Agentic Solutions logo on the left and the report date on the right. Substitute {YYYY-MM-DD}.
outlook-badge)The canonical visual treatment is pastel background + colored text. Five variants ship in the canonical CSS:
| class | when to use |
|----------|----------------------------------------------------------------------------|
| stable | issuer-level outlook is STA/Stable. |
| positive| outlook is POS/Positive. |
| negative| outlook is NEG/Negative. |
| review | outlook is RUR/On Review (also catches "Watch" semantics). |
| na | outlook unknown / not applicable; renders muted gray. |
The label text is uppercased by CSS so the inner text can be mixed-case (e.g. Stable).
PIB previously shipped a solid-fill variant (background: var(--positive); color: #fff) for
its outlook badges. That carve-out is removed — PIB now inherits the canonical pastel
variant from this shared skill, and parent templates must not re-define .outlook-badge rules.
These rules are intentionally NOT in the canonical CSS. Each parent template keeps them above the marker region (and only those — anything else inside the canonical block is shared):
| skill | allowed local overrides |
|-----------------------------|------------------------------------------------------------------------|
| earnings-brief | none. Cover variant: cover-multi. |
| peer-analysis | .page { max-width: 1050px }. Cover variant: cover-multi. |
| issuer-brief | body { font-size: 12.5px }, .page { max-width: 920px }. Cover variant: cover-simple. |
| sector-brief | none. Cover variant: cover-simple. |
Skill-specific CSS that the shared layer does not own (and which therefore stays in each parent template indefinitely):
.yoy-table, .ratings-table, .pa-table, .credit-drivers-table,
.ki-table, .sc-table, .fin-table, .data-table, .row-label, etc.)..credit-badge, .ratings-factors.cover-multi and that
use skill-specific spacing (most are already shared; anything with skill-specific tweaks
stays local)..sub-heading, .chart-container, .chart-title, .chart-legend.The canonical CSS lives only in assets/template.html inside the
<style id="shared-template-css">…</style> block. Parent templates do not carry a
duplicate copy of these rules. Each parent template instead reserves a marker region inside
its own <style> tag bracketed by CSS comments (not HTML comments — the markers sit
inside <style>, where <!-- … --> would produce CSS parse errors):
/* BEGIN shared-template-css (inlined at emit time from skills/shared/template/assets/template.html) */
/* END shared-template-css */
At emit time, the agent copies the contents (not the <style> wrapper) of
<style id="shared-template-css">…</style> from the shared asset and inserts them between
those two marker comments in the final emitted HTML. Treat the canonical CSS as a single
block — do not edit values per-skill. If a parent skill needs to restyle shared chrome, change
assets/template.html and the next emit picks it up automatically.
The block defines the following CSS custom properties on :root. They are available to every
piece of skill-specific CSS that lives above the marker region:
--navy, --accent — primary palette.--gray-100, --gray-200, --gray-300, --gray-400, --gray-700 — neutral grays.--g100, --g200, --g300, --g400, --g700 — short aliases for the same grays. Both
naming schemes resolve. Skill-specific CSS may use either family interchangeably.--text — body text color.--positive, --negative, --neutral — semantic colors used by .outlook-badge and
by skill-specific tables (e.g. positive / negative deltas).<style id="shared-template-css"> from assets/template.html have been
inlined between the /* BEGIN shared-template-css */ / /* END shared-template-css */
markers in the emitted HTML.<style id="shared-citations-css"> from
skills/shared/citations/assets/template.html have been inlined between the parallel
citations markers.<style> block contains no duplicated copy of any rule that
lives in either canonical block.cover-simple or cover-multi) and matches the
parent skill's declared variant..cover-multi's .cover-top / .cover-bottom only carries has-cover-image when an
<img> is populated..outlook-badge instances use the canonical pastel variants (stable, positive,
negative, review, na). No solid-fill / inline-color overrides anywhere.#{prefix}-sources-anchor with label Citations..report-footer + .footer-logo markup verbatim.development
Use when the user wants to spin up / create / launch / provision a DigitalOcean droplet (or "a remote dev box on DO") and connect to it from Codex as a remote SSH workspace.
data-ai
Search through Microsoft Teams chats or channels, triage unread or recent activity, draft follow-ups, and manage Planner tasks through connected Teams data.
tools
Motion / animation context for the `use_figma` MCP tool — animating Figma nodes via manual keyframes, animation styles, easing, and timeline duration. Load alongside figma-use whenever a task involves adding, editing, or inspecting animation on a node.
development
SwiftUI ↔ Figma translation. Use whenever the user mentions Swift, SwiftUI, iOS, iPhone, or iPad — in EITHER direction — translating a Figma design into SwiftUI (design → code), or pushing SwiftUI views / screens / tokens back into a Figma file (code → design). Triggers on phrases like 'implement this Figma design in SwiftUI', 'build this screen in Swift', 'push this SwiftUI view to Figma', 'mirror my Swift code in a Figma file', or whenever a Figma URL appears alongside `.swift` files / an `.xcodeproj`. Routes to a direction-specific reference doc; loads alongside `figma-use` for the code → design path.