Publicly shared .md files: Outline has no background on mobile

Describe the bug
Outline has no background, which results in unreadable overlapping text on mobile for .md notes that are shared publicly. The links in the document outline simply overlaps the text in the .md file.

To Reproduce
Steps to reproduce the behavior:

Open any shared note externally on mobile.
Open any shared note on a browser and resize the window

Expected behavior
I assume the text should have a background, and at least some basic styling to make it look "not broken".

The following is a quick and dirty fix I applied in a custom app, because even the use of white space was quite ugly:

.editor-media-handler .text-editor--readonly-bar .text-readonly-bar {
  background-color: var(--color-main-background);
  padding:0.5rem 0;
}
.text-editor__content-wrapper .text-editor__content-wrapper__left .editor--outline {
  min-width: 300px;
  width: auto; /* This is still not enough to show whole text lines */
  margin:0 auto;
  background-color: var(--color-main-background);
  padding: 0;
  margin: 0 0.5rem;
  border-radius: 0.5rem;
  z-index: 900;
  border:1px solid var(--vs-border-color);
}
.editor--toc {
  padding:0 0.5rem;
}
.editor--outline li {
  padding: 0.25rem 0;
}
.text-editor__session-list .session-list .avatar-list .avatar-wrapper {
  margin: 0.2rem 0.1rem 0;
  width: 1.5rem;
  height: 1.5rem;
}

Thanks for your report. I was able to reproduce, a fix is incoming.

fix(outline): fix mobile detection and box shadow

we have an issue reported in deck, of the same behavior still occuring: nextcloud/deck#7082
I could also reproduce outside of deck in files app on c.nc.c using firefox mobile-view thing.

Don't really know how the isMobile mixin works in text but could it be that it's not based on the actual width of the text editor but maybe entire device width? I think deck is the only place where text is not almost the entire width, so that might be the cause.

feat(outline): display table of contents on right side

Navigation Menu

Repository navigation

Publicly shared .md files: Outline has no background on mobile #6693

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Publicly shared .md files: Outline has no background on mobile #6693

Description

Activity

mejo- commented on Dec 3, 2024

grnd-alt commented on Jul 14, 2025

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions