Transform theme system from large inline dictionaries to maintainable YAML files:
**Architecture:**
- File-based themes organized by scope: mode/, ui/, document/, branding/
- Dynamic theme loading with automatic discovery
- Hybrid system maintaining 100% backward compatibility
- Rich metadata support with theme documentation
**Implementation:**
- Created markitect/themes/ directory with organized structure
- Added ThemeRegistry for dynamic YAML theme loading
- Extracted ChatGPT and Substack themes to separate files
- Added mode themes (light.yaml, dark.yaml) as examples
- Integrated with existing LAYERED_THEMES system seamlessly
**Benefits:**
- Improved maintainability: each theme is a separate file
- Better collaboration: multiple contributors can work simultaneously
- Enhanced discoverability: clear organization shows available themes
- Rich documentation: each theme file includes design notes and metadata
- Schema validation potential with YAML format
**Quality Assurance:**
- Comprehensive 12-test suite for modular system (12/12 passing)
- Backward compatibility verified with existing 15 theme tests (15/15 passing)
- CLI integration tested and working with file-based themes
- Theme combination and scoping functionality preserved
**Files Created:**
- markitect/themes/__init__.py - Theme registry and dynamic loader
- markitect/themes/README.md - Complete documentation and usage guide
- markitect/themes/document/{chatgpt,substack}.yaml - Modular theme files
- markitect/themes/mode/{light,dark}.yaml - Mode theme examples
- tests/test_modular_theme_system.py - Comprehensive test coverage
Addresses maintainability concerns while preserving all existing functionality.
No breaking changes - all existing code, CLI commands, and API calls work unchanged.
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
50 lines
1.6 KiB
YAML
50 lines
1.6 KiB
YAML
# ChatGPT Document Theme
|
|
# Mimics ChatGPT's chat interface fonts and layout for compact, interactive reading
|
|
# Issue #165: https://github.com/example/repo/issues/165
|
|
|
|
name: chatgpt
|
|
description: "Compact, modern theme inspired by ChatGPT's interface design"
|
|
scope: document
|
|
author: "Claude Code"
|
|
version: "1.0.0"
|
|
|
|
properties:
|
|
# Typography - Modern sans-serif stack
|
|
font_family: 'Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif'
|
|
heading_font_family: 'Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif'
|
|
font_size: '15px'
|
|
|
|
# Layout - Compact for interactive reading
|
|
max_width: '580px'
|
|
line_height: '1.5'
|
|
text_align: 'left'
|
|
|
|
# Colors - High contrast with ChatGPT green accents
|
|
body_background: '#ffffff'
|
|
body_color: '#1f1f1f'
|
|
heading_color: '#1f1f1f'
|
|
accent_color: '#10a37f'
|
|
link_color: '#10a37f'
|
|
link_hover_color: '#0d8c6d'
|
|
|
|
# Code styling
|
|
code_background: '#f7f7f7'
|
|
code_color: '#1f1f1f'
|
|
code_font_family: '"SF Mono", Monaco, Inconsolata, "Roboto Mono", Consolas, "Courier New", monospace'
|
|
|
|
# Spacing - Compact margins for efficiency
|
|
heading_style: 'minimal'
|
|
heading_margin: '1.2em 0 0.6em 0'
|
|
paragraph_margin: '1em 0'
|
|
|
|
# Visual elements
|
|
border_radius: '8px'
|
|
blockquote_border: '#10a37f'
|
|
blockquote_color: '#6b7280'
|
|
|
|
# Design notes:
|
|
# - Inter font provides clean, modern readability
|
|
# - 580px max-width creates chat-like compactness
|
|
# - 1.5 line height balances readability with density
|
|
# - ChatGPT green (#10a37f) creates brand consistency
|
|
# - Minimal margins maximize information density |