Refactor Paper Tonic Modern colorscheme and enhance semantic highlighting

- Updated highlights.scm to improve CSS, HTML, and data attribute captures with higher priority.
- Added a new Lua function to display highlight group and color information under the cursor.
- Expanded editor, semantic, syntax, and TreeSitter highlight groups for better visual consistency across languages.
- Created test files for PHP, HTML, CSS, and Lua to validate syntax highlighting.
- Implemented a shell script to test semantic highlights in a Neovim session.
- Simplified colorscheme loading process by removing unnecessary plugin specifications.
This commit is contained in:
Ray Elliott 2025-12-11 21:47:27 +00:00
commit 3ad385e285
16 changed files with 1121 additions and 63 deletions

View file

@ -100,6 +100,48 @@ Record every decision here with a short rationale. Append new entries; do not re
- **Loading order**: Structured to load groups in logical sequence (editor → syntax → treesitter → semantic → lsp → plugins)
- **Validation**: Colorscheme loads successfully, highlights applied correctly
- **Language color consistency**: All documentation updated to reflect that each language maintains its color identity everywhere (PHP=primary, HTML=blue, CSS=green, templates=magenta)
- 2025-12-11: Colorscheme Phase 11.4:
- **Editor highlights**: Comprehensive UI element highlighting (Normal, StatusLine, CursorLine, Visual, Search, Pmenu, Folds, Diffs, Spelling, Messages)
- **Syntax highlights**: Traditional Vim syntax groups (Comment, String, Function, Keyword, Type, etc.) with language-specific overrides
- **Language support**: Added specific highlighting for CSS (green/c2), HTML (blue/c3), Lua, Markdown, JSON, JavaScript/TypeScript, PHP
- **Color verification**: All key groups tested and verified (Normal=#8c8c8c on #ffffff, htmlTag=#005faf, cssClassName=#008700)
- **CSS classes**: Green tones (c2) for CSS syntax elements
- **HTML tags**: Blue tones (c3) for HTML structure
- **PHP syntax**: Primary brownish-red tones for PHP keywords/functions
- **Test file**: Created test-colorscheme.lua for visual verification
- 2025-12-11: Colorscheme Phase 11.5:
- **TreeSitter highlights**: Comprehensive modern `@*` highlight groups implemented
- **Core groups**: @variable, @function, @keyword, @string, @number, @boolean, @comment, @type, @property, @operator, @punctuation
- **Language constructs**: @keyword.function, @keyword.return, @keyword.conditional, @keyword.repeat, @keyword.exception
- **Markup**: @markup.strong, @markup.italic, @markup.heading (1-6), @markup.link, @markup.raw, @markup.list
- **Template languages**: @punctuation.special.twig, @keyword.jinja (magenta c5 for template syntax)
- **Diagnostics**: @diff.plus, @diff.minus, @diff.delta
- **Debug tool**: Added `<leader>hi` keymap to show highlight group and resolved colors under cursor
- **Validation**: All TreeSitter groups tested and verified with correct palette colors
- 2025-12-11: Colorscheme Phase 11.6:
- **Language-specific TreeSitter groups**: Enhanced with comprehensive per-language overrides
- **CSS/SCSS**: Properties, variables ($var, --custom), functions, tag selectors (green c2 tones)
- **HTML**: Tags, attributes, delimiters (blue c3 throughout)
- **PHP**: Variables ($var), functions, methods, built-ins ($this, $GLOBALS), properties (primary brownish-red)
- **JavaScript/TypeScript**: Variables, functions, properties, built-ins (this, arguments), JSX/TSX tags (primary + blue for JSX)
- **Lua**: Variables, functions, built-ins (_G, _VERSION), properties (primary)
- **Markdown**: Headings (1-6), links, code blocks, inline code (primary for structure)
- **JSON**: Properties, strings, numbers, booleans (neutral colors)
- **Bash/Shell**: Variables, functions, built-ins, strings (primary)
- **Color consistency verified**: HTML=#005faf (blue), CSS properties=#7c6666 (primary_weak), PHP variables=#7c6666
- **Test files**: Created test-html.html, test-css.css, test-colors.php for validation
- 2025-12-11: Colorscheme Phase 11.7:
- **Semantic highlighting**: Custom TreeSitter captures for cross-language consistency
- **CSS semantic captures**: @CssClassName (green c2), @CssIdentifier (strong green c2_strong, bold), @cssPseudoClass (weak green c2_weak), @cssNestingSelector (strong green), @CssUniversalSelector
- **CSS properties**: @CssProp (primary_weak), @CssPropertyValue (bold fg), @CssUnit (delimiter)
- **CSS media queries**: @cssMediaFeatureName, @cssMediaQuery, @cssMediaQueryValue
- **HTML attributes**: @ClassNameAttribute, @IdAttribute, @DataAttribute (all fg_weak for attribute names)
- **HTML data attributes**: @DataAttributeValue (Function color)
- **Cross-language consistency**: Critical feature - class="my-class" in HTML uses same color (@CssClassName, green c2) as .my-class in CSS; id="my-id" in HTML uses same color (@CssIdentifier, green c2_strong) as #my-id in CSS
- **Visual benefits**: Easy to visually match selectors between HTML and CSS files; consistent color coding across languages
- **Custom queries**: Leverages existing after/queries/css/highlights.scm and after/queries/html/highlights.scm
- **Priority fix**: Added `(#set! priority 200)` to all custom captures to override built-in captures (@string priority 99, @constant default priority)
- **Technical note**: Custom queries require `;extends` directive and higher priority than built-in captures to work correctly
## Project-Local Configuration (design)