Skip to content

feat: Add collapsible code blocks (fixes #2425)#3776

Open
sersiendotodo-cleo wants to merge 1 commit intoBoostIO:masterfrom
sersiendotodo-cleo:fix/issue-2425-collapsible-code-blocks
Open

feat: Add collapsible code blocks (fixes #2425)#3776
sersiendotodo-cleo wants to merge 1 commit intoBoostIO:masterfrom
sersiendotodo-cleo:fix/issue-2425-collapsible-code-blocks

Conversation

@sersiendotodo-cleo
Copy link

This PR adds collapsible code blocks functionality. Code blocks with more than 15 lines are automatically collapsible with an expand/collapse button at the top-left corner.

Features

  • Automatically detects code blocks longer than 15 lines
  • Adds expand/collapse button at top-left corner
  • Shows gradient overlay when collapsed
  • Theme-aware styling (works with light and dark themes)
  • Does not interfere with existing copy-to-clipboard functionality

Implementation

  • Modifies browser/components/MarkdownPreview.js to add collapse functionality
  • Injects minimal CSS only when needed
  • Uses existing theme selectors for consistent styling

Testing

Tested with various code block lengths and themes. Works with:

  • Light and dark themes
  • All code languages
  • Existing copy button

Closes #2425

- Code blocks with more than 15 lines are automatically collapsible
- Add expand/collapse button at top-left corner
- Shows gradient overlay when collapsed to indicate more content
- Addresses issue BoostIO#2425
@sersiendotodo-cleo
Copy link
Author

👋 Friendly bump on this PR. Ready for review - implements collapsible code blocks as requested in the bounty. Let me know if any changes are needed!

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.

Add collapsible code blocks

1 participant