☰

LMArena | Collapsible Code Blocks

Adds collapsible code blocks with clickable headers, footer controls, and a global toolbar toggle

Nasıl kurarım

Bu betiği kurabilmeniz için Tampermonkey, Greasemonkey ya da Violentmonkey gibi bir kullanıcı betiği eklentisini kurmanız gerekmektedir.

You will need to install an extension such as Tampermonkey to install this script.

Bu betiği kurabilmeniz için Tampermonkey ya da Violentmonkey gibi bir kullanıcı betiği eklentisini kurmanız gerekmektedir.

Bu betiği kurabilmeniz için Tampermonkey ya da Userscripts gibi bir kullanıcı betiği eklentisini kurmanız gerekmektedir.

Bu betiği indirebilmeniz için ayrıca Tampermonkey gibi bir eklenti kurmanız gerekmektedir.

Bu komut dosyasını yüklemek için bir kullanıcı komut dosyası yöneticisi uzantısı yüklemeniz gerekecek.

(Zaten bir kullanıcı komut dosyası yöneticim var, kurmama izin verin!)

Nasıl kurarım

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(Zateb bir user-style yöneticim var, yükleyeyim!)

Yazar
piknockyou
Günlük kurulumlar
2
Toplam kurulumlar
5
Değerlendirmeler
0 0 0
Versiyon
4.2
Oluşturulma
29.12.2025
Güncellenme
31.12.2025
Boyut
67,4 KB
Lisans
AGPL-3.0
Geçerli

See screenshots at the bottom

LMArena | Code Block Collapse

Adds clean collapse controls to code blocks (header toggle + footer bar) and a global toolbar control for collapsing/expanding all blocks. Ideal for long conversations with lots of code.

Why You Need This

Long AI responses with multiple code blocks make conversations hard to navigate:

  • Scrolling fatigue: Endless scrolling past code you've already reviewed.
  • Context lost: Hard to see the conversation flow buried under walls of code.
  • No native solution: LMArena has no built-in way to collapse code blocks.

This script lets you collapse code blocks down to their header and expand them when needed.

Key Features

  • Per-Block Footer Bar (No Overlay): Each code block gets a bottom “Collapse” bar that never covers code when you’re at the bottom of the block.
  • Smart Fixed Footer (When Needed): If a code block is tall and its footer would be obscured by the input area, a single global fixed footer appears above the input so you can still collapse it—without covering the code block header.
  • Clickable Headers: Click any code block header to toggle collapse/expand.
  • Global Toolbar Controls: A compact dual button is added to the input toolbar:
    • Collapse all
    • Expand all
  • Hold-to-Toggle Auto-Collapse: Hold the Collapse toolbar button to enable/disable persistent auto-collapse for code blocks.
  • Smart Scroll Anchoring: Prevents jarring scroll jumps when collapsing large blocks by preserving your visual position.
  • Instant Performance: Uses instant toggling (no slow animations) so the UI stays snappy even with many blocks.
  • Persisted Settings: Auto-collapse preference is saved locally.

How to Use

Action Result
Click footer bar on a code block Collapse that specific code block
Click code block header Toggle collapse/expand for that block
Click toolbar “Collapse” Collapse all code blocks
Click toolbar “Expand” Expand all code blocks
Hold toolbar “Collapse” Toggle persistent auto-collapse ON/OFF

Performance Notes

  • Incremental detection: Uses MutationObserver to only process newly added code blocks (no full-page rescans on every update).
  • Synchronous toggling: Collapses/expands instantly to avoid UI flicker and layout thrash.
  • Efficient updates: The global fixed footer updates are throttled via requestAnimationFrame during scroll/resize.

Installation

  1. Install Violentmonkey, Tampermonkey, or Greasemonkey.
  2. Install this script.
  3. Visit lmarena.ai.

Works immediately. The toolbar buttons appear next to the Submit button in the input area.

Keyboard Accessibility

  • Code block headers are focusable via Tab.
  • Code block footer bars are focusable via Tab.
  • Enter or Space toggles/collapses depending on the focused control.