Skip to content

Add collapse all / expand all button for sidebar chapters #3050

@tupe12334

Description

@tupe12334

Problem

When a book has many nested chapters with folding enabled, there is no way to collapse or expand all chapters at once. Users must click each chapter's fold toggle individually. VSCode's file explorer has a convenient "Collapse All" button for this exact use case, and mdBook would benefit from the same.

Proposed Solution

Add a button in the menu bar that toggles all chapter folds at once, similar to VSCode's collapse-all button.

  • Placement: In the menu bar's left-buttons area, to the left of the sidebar toggle (hamburger icon)
  • Icons: Use font-awesome-as-a-crate (already a dependency) — square-minus for collapse all, square-plus for expand all, using the regular (outline) style
  • Scope: Only affects top-level foldable chapter items (ol.chapter > li.chapter-item with a child ol.section), not the "On This Page" heading nav groups
  • Visibility: Only shown when [output.html.fold.enable] is true; auto-hidden when JS is disabled (inherits html:not(.js) .left-buttons button { display: none })
  • Behavior: If any foldable chapter is expanded → collapse all; if all are collapsed → expand all. Icon syncs when individual chapter toggles are clicked. The existing 0.5s CSS chevron rotation transition applies automatically.

Files to modify:

File Change
crates/mdbook-html/front-end/templates/index.hbs Add <button> in left-buttons div + <template> elements for FA icons
crates/mdbook-html/front-end/templates/toc.js.hbs Add click handler + icon state sync in connectedCallback() via DOMContentLoaded

No changes needed in toc.rs or chrome.css — the button is entirely client-side and inherits existing .icon-button and menu bar styles.

Notes

The infrastructure for this is mostly in place — folding already works via the expanded class on li.chapter-item elements, and CSS handles visibility and chevron animation. The main work is adding the button UI and a small JS handler to toggle all items at once.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions