Skip to content

Add support for the Marpit color directive#146

Merged
jongalloway merged 3 commits intomainfrom
feature/issue-144-color-directive
Mar 31, 2026
Merged

Add support for the Marpit color directive#146
jongalloway merged 3 commits intomainfrom
feature/issue-144-color-directive

Conversation

@jongalloway
Copy link
Copy Markdown
Owner

Summary

  • add parser and slide-style support for the Marpit color directive in front matter, local directives, and spot directives
  • apply slide-level text color overrides during PPTX rendering, including heading text
  • cover the behavior with focused parser/renderer tests and the existing directives smoke sample

Fixes #144.

Validation

  • dotnet test tests/MarpToPptx.Tests/MarpToPptx.Tests.csproj -c Release --no-restore -- --filter-method "*Parser_FrontMatterColor_AppliesToAllSlidesByDefault" --filter-method "*Parser_SpotColor_DoesNotCarryForward" --filter-method "*Renderer_AppliesSlideColorDirectiveToHeadingText"
  • ./scripts/Invoke-PptxSmokeTest.ps1 -InputMarkdown samples/02-directives.md -Configuration Release -CiSafe

Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Adds Marpit color directive support across parsing, slide style modeling, and PPTX rendering so authors can override default slide text color (including headings) via front matter, local directives, and spot directives.

Changes:

  • Extend parser + SlideStyle to recognize and carry color (global/local/spot) and include it in slide identity hashing for update mode.
  • Apply slide-level text color overrides in the PPTX renderer (headings/body/code/inline-code).
  • Add focused parser/renderer tests and update directive smoke sample + smoke runner selection.

Reviewed changes

Copilot reviewed 10 out of 10 changed files in this pull request and generated 3 comments.

Show a summary per file
File Description
tests/MarpToPptx.Tests/PptxRendererTests.cs Adds renderer test asserting slide color affects heading text runs.
tests/MarpToPptx.Tests/ParserTests.cs Adds parser coverage for global color and spot _color carry-forward behavior.
src/MarpToPptx.Pptx/Rendering/OpenXmlPptxRenderer.cs Applies slide-level text color overrides by mutating the effective theme per slide.
src/MarpToPptx.Core/Parsing/MarpMarkdownParser.cs Allows color from front matter to flow into default slide style.
src/MarpToPptx.Core/Parsing/MarpDirectiveParser.cs Adds directive mapping for color into SlideStyle.Color.
src/MarpToPptx.Core/Models/SlideDeck.cs Introduces SlideStyle.Color field.
src/MarpToPptx.Core/Authoring/SlideIdentityGenerator.cs Includes Color in slide content hash (update mode correctness).
scripts/Invoke-AllPptxSmokeTests.ps1 Adds 02-directives.md to the selected contrast-audit sample set.
samples/02-directives.md Updates directives sample to exercise color local/spot behavior.
doc/marp-markdown.md Documents color as a supported directive in feature matrix + front matter table.
Comments suppressed due to low confidence (1)

tests/MarpToPptx.Tests/ParserTests.cs:1424

  • This spot directive example uses a CSS named color (red). Since the renderer writes run colors as a:srgbClr hex values, named colors will currently serialize to an invalid hex string. Use a hex/rgb() value here, or add proper CSS color parsing for directive values.
        <!-- _color: red -->

Comment on lines +896 to +900
return theme with
{
TextColor = color,
Body = theme.Body with { Color = color },
Code = theme.Code with { Color = color },
Copy link

Copilot AI Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ApplySlideTextColor stores the raw directive value (e.g. "rgb(...)" / "white") into ThemeDefinition.*.Color, but the renderer later writes colors using NormalizeColor, which currently only produces valid hex for #RGB/#RRGGBB inputs. This can emit invalid a:srgbClr values and lead to OpenXML validation errors or PowerPoint repair when users use Marpit-legal color formats. Consider normalizing/validating the directive color to a 6-digit hex string before applying it (or upgrade NormalizeColor to handle rgb()/rgba() similarly to DiagramThemeFactory).

Copilot uses AI. Check for mistakes.
Comment thread tests/MarpToPptx.Tests/ParserTests.cs Outdated
Comment on lines +1419 to +1420
<!-- color: white -->
# Slide One
Copy link

Copilot AI Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This test uses CSS named colors (white, red) for the color directive. The PPTX renderer currently only serializes colors correctly for hex inputs (it writes a:srgbClr), so these values would produce invalid color hex in output if exercised end-to-end. Either constrain directive/test values to supported hex/rgb forms, or extend color normalization to support named colors.

This issue also appears on line 1424 of the same file.

Copilot uses AI. Check for mistakes.
Comment thread samples/02-directives.md
Comment on lines 42 to +45
<!-- backgroundColor: #102A43 -->
<!-- backgroundImage: -->
<!-- class: contrast -->
<!-- color: #FFFFFF -->
Copy link

Copilot AI Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

class: contrast is used here, but the front-matter style: block no longer defines a section.contrast { ... } variant (only section.lead). As a result the sample no longer demonstrates a meaningful class-variant override for contrast (it just sets a class name with no styling effect in MarpToPptx). Consider either reintroducing a minimal section.contrast style (not just color) or changing this directive to a class that is actually defined in the sample CSS.

Copilot uses AI. Check for mistakes.
@jongalloway
Copy link
Copy Markdown
Owner Author

@copilot apply changes based on the comments in this thread

Copilot AI and others added 2 commits March 31, 2026 02:55
…ex colors, add section.contrast CSS

Agent-Logs-Url: https://github.com/jongalloway/MarpToPptx/sessions/82ea9712-e556-49bd-a1f2-328f5703cbc1

Co-authored-by: jongalloway <68539+jongalloway@users.noreply.github.com>
Copy link
Copy Markdown
Contributor

Copilot AI commented Mar 31, 2026

@copilot apply changes based on the comments in this thread

Applied all three review fixes in commit 5adccd0 (+ 13473ed for the sample differentiator):

  1. NormalizeColor now handles rgb()/rgba() — promoted DiagramThemeFactory.NormalizeHexColor to internal and delegated to it for rgb/rgba inputs, preventing invalid a:srgbClr values from Marpit-legal color formats.

  2. Parser tests use hex values — replaced CSS named colors (white, red) with #FFFFFF and #FF0000 so the test values are valid end-to-end.

  3. section.contrast is now defined in the sample — added section.contrast { letter-spacing: 0.5px; } to the front-matter style block, giving it a distinct effect from section.lead { font-weight: 600; } so the class: contrast directive demonstrates meaningful CSS styling.

@jongalloway jongalloway merged commit 7d4573b into main Mar 31, 2026
5 checks passed
@jongalloway jongalloway deleted the feature/issue-144-color-directive branch March 31, 2026 03:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Support color directive for text color

3 participants