When using a custom theme, the #launcher-container is not scrollable on mobile devices. #392

New Issue

giteasync · 2025-10-01T15:51:37-05:00

giteasync commented

2025-10-01 15:51:37 -05:00

Originally created by @SiriusXT on GitHub.

Description

When using a custom theme, I set the following labels on the theme note: #appTheme=theme-name. However, when using Trilium on a mobile device, the #launcher-container is not scrollable.

TriliumNext Version

0.94.0

What operating system are you using?

Other (specify below)

What is your setup?

Local (no sync)

Operating System Version

Android firefox

Error logs

No response

Originally created by @SiriusXT on GitHub. ### Description When using a custom theme, I set the following labels on the theme note: #appTheme=theme-name. However, when using Trilium on a mobile device, the #launcher-container is not scrollable. ![Image](https://github.com/user-attachments/assets/b2a6a329-8071-4352-baa1-fb28d48a312d) ### TriliumNext Version 0.94.0 ### What operating system are you using? Other (specify below) ### What is your setup? Local (no sync) ### Operating System Version Android firefox ### Error logs _No response_

giteasync commented

2025-10-01 15:51:38 -05:00

@dosubot[bot] commented on GitHub:

This issue is usually caused by missing or overridden CSS in your custom theme. The scrollability of #launcher-container depends on the CSS property overflow-y: auto. If your theme doesn't set this, or overrides it, scrolling won't work—especially on mobile. To fix this, add the following to your custom theme:

#launcher-container {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch; /* improves mobile scrolling, especially on iOS */
}

Make sure your theme uses :root for CSS variables and doesn't rely on old body class prefixes, as Trilium changed theme handling in recent versions. For reference, see the release notes for v0.48.

No JavaScript manages this scroll behavior—it's all CSS-driven. If you still have issues, double-check that your theme doesn't unintentionally override these properties elsewhere.

To reply, just mention @dosu.

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}

@dosubot[bot] commented on GitHub:  This issue is usually caused by missing or overridden CSS in your custom theme. The scrollability of `#launcher-container` depends on the CSS property `overflow-y: auto`. If your theme doesn't set this, or overrides it, scrolling won't work—especially on mobile. To fix this, add the following to your custom theme: ```css #launcher-container { overflow-y: auto; -webkit-overflow-scrolling: touch; /* improves mobile scrolling, especially on iOS */ } ``` Make sure your theme uses `:root` for CSS variables and doesn't rely on old body class prefixes, as Trilium changed theme handling in recent versions. For reference, see the [release notes for v0.48](https://github.com/TriliumNext/Trilium/wiki/Release%20notes%20v0.48). No JavaScript manages this scroll behavior—it's all CSS-driven. If you still have issues, double-check that your theme doesn't unintentionally override these properties elsewhere.  *To reply, just mention [@dosu](https://go.dosu.dev/dosubot).* --- <sup>How did I do? [Good](https://app.dosu.dev/response-feedback/787e2ea7-ee3f-4899-b6f3-88dbb214b851?feedback_type=great_response) | [Irrelevant](https://app.dosu.dev/response-feedback/787e2ea7-ee3f-4899-b6f3-88dbb214b851?feedback_type=irrelevant_answer) | [Incorrect](https://app.dosu.dev/response-feedback/787e2ea7-ee3f-4899-b6f3-88dbb214b851?feedback_type=incorrect_sources) | [Verbose](https://app.dosu.dev/response-feedback/787e2ea7-ee3f-4899-b6f3-88dbb214b851?feedback_type=too_verbose) | [Hallucination](https://app.dosu.dev/response-feedback/787e2ea7-ee3f-4899-b6f3-88dbb214b851?feedback_type=hallucination) | [Report 🐛](https://app.dosu.dev/response-feedback/787e2ea7-ee3f-4899-b6f3-88dbb214b851?feedback_type=bug_report) | [Other](https://app.dosu.dev/response-feedback/787e2ea7-ee3f-4899-b6f3-88dbb214b851?feedback_type=other)</sup>  [![Chat with Dosu](https://dosu.dev/dosu-chat-badge.svg)](https://app.dosu.dev/4af773a7-9840-4978-96dc-c436f6f437cf/ask?utm_source=github) [![Join Discord](https://img.shields.io/badge/join-5865F2?logo=discord&logoColor=white&label=)](https://go.dosu.dev/discord-bot) [![Share on X](https://img.shields.io/badge/X-share-black)](https://twitter.com/intent/tweet?text=%40dosu_ai%20helped%20me%20solve%20this%20issue!&url=https%3A//github.com/TriliumNext/Trilium/issues/5713)

giteasync referenced this issue

2025-10-01 17:13:11 -05:00

[PR #392] [MERGED] Better icon for iOS' homescreen #5694

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: TriliumNext/Trilium#392