]> danix's work - danix.xyz-2.git/commit
refactor: syntax highlighting with Catppuccin Macchiato and copy buttons
authorDanilo M. <redacted>
Sat, 18 Apr 2026 17:02:18 +0000 (19:02 +0200)
committerDanilo M. <redacted>
Sat, 18 Apr 2026 17:02:18 +0000 (19:02 +0200)
commit17048ab79312f1752a296ab150984a4ef30aed5c
tree732a7f1e6cf78d0d75e737848ad9328df7a8dd77
parent46779476a570346661a2741607265caed42829b2
refactor: syntax highlighting with Catppuccin Macchiato and copy buttons

- Add [markup.highlight] config: noClasses=false for CSS class output, lineNos=true with lineNumbersInTable=true for proper line number rendering
- Create render-codeblock.html render hook to intercept fenced code blocks and wrap with header bar (language label + copy button)
- Replace chroma-custom.css entirely with Catppuccin Macchiato palette (dark theme) + Catppuccin Latte (light theme), with full token color mapping
- Create code-copy.js: copy-to-clipboard logic with language pretty-name map (bash→Shell, js→JavaScript, etc.), icon swap (copy→check for 2s), and aria-live region for screen reader announcement (WCAG 4.1.3)
- Update baseof.html to load code-copy.js on page kind with Hugo Pipes
- WCAG AA compliance: line number contrast fixed to ~3.5:1 (--ctp-overlay0), light theme copy button color to 4.1:1 (#6c6f85), focus outline 6.21:1 (--ctp-lavender), screen reader announcements via aria-live

All code blocks now render with: syntax highlighting (noClasses=true fixed), line numbers with proper table layout, language label in header, copy button with feather icons, both dark and light theme support.

Co-Authored-By: Claude Haiku 4.5 <redacted>
hugo.toml
themes/danix-xyz-hacker/assets/css/chroma-custom.css
themes/danix-xyz-hacker/assets/js/code-copy.js [new file with mode: 0644]
themes/danix-xyz-hacker/layouts/_default/_markup/render-codeblock.html [new file with mode: 0644]
themes/danix-xyz-hacker/layouts/_default/baseof.html