feat: implement modular theme system with file-based theme organization
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>
This commit is contained in:
36
markitect/themes/mode/dark.yaml
Normal file
36
markitect/themes/mode/dark.yaml
Normal file
@@ -0,0 +1,36 @@
|
||||
# Dark Mode Theme
|
||||
# Dark color scheme for low-light reading
|
||||
|
||||
name: dark
|
||||
description: "Comfortable dark color scheme for low-light environments"
|
||||
scope: mode
|
||||
author: "Markitect Core"
|
||||
version: "1.0.0"
|
||||
|
||||
properties:
|
||||
# Base colors
|
||||
body_background: '#0d1117'
|
||||
body_color: '#e6edf3'
|
||||
heading_color: '#f0f6fc'
|
||||
|
||||
# Code blocks
|
||||
code_background: '#161b22'
|
||||
code_color: '#e6edf3'
|
||||
|
||||
# Borders and lines
|
||||
border_color: '#30363d'
|
||||
table_border: '#30363d'
|
||||
table_header_bg: '#161b22'
|
||||
|
||||
# Blockquotes
|
||||
blockquote_border: '#30363d'
|
||||
blockquote_color: '#7d8590'
|
||||
|
||||
# Links
|
||||
link_color: '#58a6ff'
|
||||
link_hover_color: '#79c0ff'
|
||||
|
||||
# Design notes:
|
||||
# - GitHub dark theme inspired colors
|
||||
# - Reduced eye strain for nighttime reading
|
||||
# - Blue links provide good contrast on dark background
|
||||
36
markitect/themes/mode/light.yaml
Normal file
36
markitect/themes/mode/light.yaml
Normal file
@@ -0,0 +1,36 @@
|
||||
# Light Mode Theme
|
||||
# Light color scheme for daytime reading
|
||||
|
||||
name: light
|
||||
description: "Clean light color scheme for comfortable daytime reading"
|
||||
scope: mode
|
||||
author: "Markitect Core"
|
||||
version: "1.0.0"
|
||||
|
||||
properties:
|
||||
# Base colors
|
||||
body_background: '#ffffff'
|
||||
body_color: '#333333'
|
||||
heading_color: '#24292f'
|
||||
|
||||
# Code blocks
|
||||
code_background: '#f6f8fa'
|
||||
code_color: '#24292e'
|
||||
|
||||
# Borders and lines
|
||||
border_color: '#d0d7de'
|
||||
table_border: '#d0d7de'
|
||||
table_header_bg: '#f6f8fa'
|
||||
|
||||
# Blockquotes
|
||||
blockquote_border: '#dfe2e5'
|
||||
blockquote_color: '#6a737d'
|
||||
|
||||
# Links
|
||||
link_color: '#0969da'
|
||||
link_hover_color: '#0550ae'
|
||||
|
||||
# Design notes:
|
||||
# - High contrast for excellent readability
|
||||
# - GitHub-inspired color palette for familiarity
|
||||
# - Subtle grays for secondary elements
|
||||
Reference in New Issue
Block a user