feat: theme engine — 11 presets, background patterns, share button#41
Open
jccidc wants to merge 9 commits into
Open
feat: theme engine — 11 presets, background patterns, share button#41jccidc wants to merge 9 commits into
jccidc wants to merge 9 commits into
Conversation
… print/PDF Theme Switcher (11 presets): - Teal Slate, Terracotta Sage, Editorial Rose, Deep Navy Gold, Amber Emerald - Dracula, Nord, Catppuccin Mocha (warm mauve), Solarized Light, Rose Pine Dawn, GitHub Light - Runtime CSS variable swaps + Google Fonts hot-reload - Mermaid diagrams re-render with updated themeVariables on every switch - Light/dark mode toggle with mode-aware color adjustments Background Patterns (15 options): - Dot Grid, Hex Grid (jimmycc.com SVG), Diagonal Lines, Cross Hatch - Radial Glow, Dual Glow, Blueprint Grid, Noise Texture - Honeycomb, Isometric, Topography, Parchment, Sketchbook, Graph Paper, Linen - All mode-aware: stronger opacity in light mode, auto-reapply on theme change Share Button: - Copy HTML (strips chrome, bakes theme into inline styles) - Download .html (same clean output as file) - Save as PDF (bakes computed colors for print, toast with instructions) Page Break System: - Toolbar toggle enters page break mode - Click between sections to place visual break markers - Markers become break-before:page in print, hidden in output - Click X to remove any marker Print/PDF: - @page margin:0 suppresses browser headers/footers - print-color-adjust:exact on all elements preserves active theme - Background colors baked as inline styles before print Other: - Windows start command in SKILL.md - marketplace.json version sync (0.5.1 -> 0.6.3) - share.sh checks Claude Code skill paths - Accessibility: focus-visible, ARIA landmarks, contrast guidance - Component borders upgraded to --border-bright for visibility
…nreliable Page break markers, print preview overlay, and Save as PDF removed. CSS print page breaks are a black box — break-before/break-inside hints don't give enough control for presentation-quality output. Use slide mode (/generate-slides) for shareable decks instead. Share menu now: Copy HTML, Download .html (both strip chrome, bake theme). Print CSS retained: break-inside:avoid on components, theme preservation.
SKILL.md had the entire "Step 4: Interactive Controls" section (theme switcher, background patterns, share button requirement) as an unstaged local change — agents loading from git got no theme engine instructions. Now committed. Also syncs version to 0.7.0 across plugin.json, marketplace.json, package.json, and SKILL.md frontmatter. CHANGELOG print styles bullet removed (feature was reverted in 30213a5), replaced with Removed section noting the revert.
Rebrand fork as distinct skill from upstream nicobailon/visual-explainer. - Skill name: visual-explainer -> my-visual-explainer (prevents collision) - Repo: jccidc/visual-explainer -> jccidc/my-visual-explainer - Inner plugin dir: plugins/visual-explainer/ -> plugins/my-visual-explainer/ - Author metadata: nicobailon -> jccidc (LICENSE attribution preserved) - CHANGELOG historical entries left intact as release-history fact
Local permission allowlist should not be tracked — varies per dev machine.
If the initial `await mermaid.render()` in theme-switcher-demo.html rejects on any parse error, the module script halts before the theme, background, and share dropdown handlers are wired, leaving all three visibly broken. Wrap the initial render, ThemeSwitcher.init(), and BG_PATTERNS[0].apply() in try/catch so one failing piece can't take down the whole toolbar. Add SKILL.md guidance so generated pages follow the same pattern. Bump to 0.7.1.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
themeVariablesstartcommand added to browser-open instructionsTheme Presets
Background Patterns
Overview
Files Changed
Test Matrix
Implementation
theme-switcher-demo.html— canonical reference template (1,730 lines) with all presets, patterns, and share logiccss-patterns.md— +748 lines: theme switcher CSS, share button, background patterns, accessibilitySKILL.md— new Step 4 "Interactive Controls (Required)" with implementation checklistshare.sh— Claude Code skill paths addedREADME.md— updated with v0.7.0 features and screenshotsTest plan
theme-switcher-demo.html— verify all 11 presets cycle correctly