Explorer component is collapsed with several community themes

[ForsakenDelusion]

The Explorer title is partially clipped when the Explorer component is collapsed. This occurs with several community themes, including Aura, but does not occur with Quartz's default theme.

The issue appears to be caused by theme-specific typography styles overriding the Explorer title size or line height. The collapsed Explorer container has a height of approximately 1.2rem and uses overflow-y: hidden, so larger title text is clipped.

To Reproduce

Steps to reproduce the behavior:

1. Create a Quartz v5 site.
2. Enable the Explorer component.
3. Apply a community theme such as Aura.
4. Open the site on a desktop browser.
5. Collapse the Explorer component.
6. Observe that the bottom of the Explorer title is clipped.

Expected behavior

The complete Explorer title should remain visible after collapsing the component.

Screenshots and Source

The bottom of the Explorer title is visibly cut off after collapsing the component.

Switching from the Aura theme to Quartz's default theme resolves the issue without changing the Explorer configuration.

A temporary workaround is:

@media all and (min-width: 801px) {
  .explorer.collapsed {
    flex: 0 1 1.5rem;
    min-height: 1.5rem;
  }

  .explorer button.desktop-explorer h2 {
    font-size: 1rem;
    line-height: 1.2rem;
  }
}

Desktop :

• Quartz Version: v5.0.0
• node Version: v26.7.0
• npm version: 11.19.0
• OS: macOS26.6.1
• Browser: Edge

Additional context

Quartz's default Explorer styles use:

.explorer.collapsed {
  flex: 0 1 1.2rem;
}

button.desktop-explorer h2 {
  font-size: 1rem;
}

Some themes override the Explorer title size. For example, Aura applies:

.explorer-toggle > h2 {
  font-size: 1.318rem;
}

This mismatch between the collapsed container height and the theme's title typography appears to cause the clipping. The issue may affect other themes with similar typography overrides.