Skip to content

Claude/fix lint quotes docs 011 c utejd8kjxo e1 x2 nv44i2#2

Merged
kanad13 merged 7 commits intomainfrom
claude/fix-lint-quotes-docs-011CUtejd8kjxoE1X2NV44i2
Nov 7, 2025
Merged

Claude/fix lint quotes docs 011 c utejd8kjxo e1 x2 nv44i2#2
kanad13 merged 7 commits intomainfrom
claude/fix-lint-quotes-docs-011CUtejd8kjxoE1X2NV44i2

Conversation

@kanad13
Copy link
Owner

@kanad13 kanad13 commented Nov 7, 2025

No description provided.

Implement native HTML5 <details> elements for TOC collapsibility:
- Headings with sub-headings are now collapsible/expandable
- All sections open by default for immediate document overview
- Uses recursive algorithm to build properly nested structure
- Zero JavaScript dependencies - leverages native browser functionality
- Includes smooth CSS transitions and custom chevron indicators
- Maintains accessibility with built-in keyboard navigation

Updated documentation:
- README: Added collapsible TOC to features list
- Architecture: Documented TOC implementation and collapsibility logic
- Added comprehensive test file with deeply nested headings

File changes:
- Modified generateTOC() function to use recursive tree-building
- Added CSS styles for details/summary elements
- Code increased from ~677 to ~748 lines (+71 lines)
…sections

Fixed issue where clicking TOC items caused layout problems:
- Added stopPropagation() to link clicks to prevent summary toggle
- Added click handler on summary to prevent toggle when clicking links
- Now: click chevron to collapse/expand, click text to navigate
- Prevents conflicting events that were causing sidebar overlap

This ensures clean separation between navigation and collapse/expand actions.
Removed flexbox from body element that was causing layout conflicts:
- Body no longer uses display: flex (conflicted with fixed sidebar)
- Content element no longer uses flex: 1 (not needed in block layout)
- Added min-height: 100vh and width: auto for proper content sizing

This ensures stable layout where sidebar stays fixed on left (280px)
and content area maintains proper margin-left without overlap issues
when collapsing/expanding TOC sections.
Added explicit active state rules for levels 3-6 to override grey text:
- Levels 4-6 had grey text (color: #666) that wasn't changing to white when active
- CSS specificity issue: grey color rule had same specificity as active state
- Solution: Added more specific .toc-level-X .toc-link.active rules
- Now all levels (1-6) consistently show white text on blue background when active

This ensures proper contrast and consistent visual feedback across all heading levels.
Simplified TOC styling by using same color for all heading levels:
- Removed grey color (#666) from levels 4-6
- All levels now use consistent blue (#0066cc)
- Removed now-unnecessary active state overrides
- Visual hierarchy still maintained through font-size differences only
- Simpler CSS with fewer special cases to maintain

Result: Cleaner, more consistent UI with better maintainability.
Added [Unreleased] section documenting:
- New collapsible/expandable TOC sections using HTML5 details
- Native browser accessibility features
- Bug fixes for click conflicts, layout overlap, and active state highlighting
- Styling consistency improvements across all TOC levels
- Code size increase (~677 to ~748 lines)
- Change empty string initialization from single to double quotes (line 282)
- Replace template literals with regular double-quoted strings where no interpolation is used (lines 299, 301, 308, 313)
- Ensures compliance with project's ESLint quote style rule
- All 5 linting errors now resolved

This change was required to merge the collapsible-outline-sidebar feature branch,
which introduced the new recursive tree-building algorithm for the TOC.
@kanad13 kanad13 merged commit d0d6564 into main Nov 7, 2025
1 check passed
@kanad13 kanad13 deleted the claude/fix-lint-quotes-docs-011CUtejd8kjxoE1X2NV44i2 branch November 7, 2025 14:29
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants