Improve Theme Architecture

[browneyedsoul]

Describe feature

Hi, first of all, thank you for maintaining Trilium. I really enjoy using it.

I wanted to share a suggestion about how themes are handled.
Right now, a lot of theme logic seems to rely on injecting <style> tags in various places, which makes styles a bit scattered and harder to reason about.

In the long term, I think it would be much more maintainable to have a single source of truth for the current theme at the top level, for example by toggling a class or attribute on the root html or body element (e.g. class="theme-light" / class="theme-dark" or data-theme="light", data-theme="dark"). All theme-specific CSS could then be written to depend on that one flag.

This kind of structure usually pays off later:

• It makes it easier to maintain and refactor themes over time.
• It provides a clear and consistent way for future plugins to detect and react to the current theme.
• If you ever introduce a plugin or theme marketplace, it reduces technical debt because themes won’t have to rely on ad-hoc <style> injection or scattered overrides just to respond to a light/dark mode toggle on the root html/body element.

I believe moving toward a centralized theme mechanism at the html/body level would make Trilium’s theming system more robust and future-proof. Thanks for considering this!

Additional Information

• And for many users who want to customize the theme, it would be much simpler. They could just override a small set of CSS variables instead of digging into multiple <style> blocks or custom selectors.
• It would also make it easier in the long run to phase out technical debt such as the (Legacy) entry currently shown in the theme selector.