Logseq One Theme

📸 Screenshots | ✨ What's changed | 📦 Install | 🔨 How to build | 🙏 Credits

A clean theme for Logseq inspired by One Dark Pro.
Including native accent color support!
Up-to-date and compatible to latest Logseq v0.10.5!

Screenshots

Dark	Light

What's changed

Features

• included page property icons
• improved block reference style
• header labels
• included task and admonition block styles (as can be found in plugin logseq-awesome-content)
• integrated support for banners plugin
• support for new accent color selection (introduced in Logseq v0.10.0)
• numerous improvements & fixes to color scheme and polished header styles (compared to original Atmos theme)

Inspired by: Atmos Theme

The Logseq One Theme in its first iteration is strongly inspired by logseq-atmos-theme. Its stylesheet has been largely rewritten and this new theme aims to provide a cleaner experience and set some different accents.

Basic differences

This list might be outdated and there may be more differences now as this project is evolving. Probably there are more to come as the theme will go in another direction.

• scrollbar: less obtrusive
• headings
  • reduced weight of font
  • slightly less underlining thickness
  • restored normal case
• dark theme: accentuated bold and italic font color
• page & block properties: restyled with borders
• selection: better background color for selected blocks
• tasks: dim done or canceled elements (instead of strike through)
• journal: changed header icon
• links: adjusted hover style for external links
• Fix: invisible PDF annotation pages title
• Fix: missing hover style for PDF asset links
• Fix: inconsistent menu and header button styling and hover animations
• Fix: readability of light codemirror theme
• Fix: unwanted gradient background in left sidebar bottom area
• Fix: banners integration in wide mode
• Fix: unused variables, invalid CSS selectors / rules from Atmos
• Refactor: use standard Logseq variables to prevent redundant CSS rules

Known issues / Roadmap

• table styles
• page tooltip layout
• complete accent color support (WIP)
• dark theme: mixture of bold and italic styles (consistency)
• light code mirror theme inconsistency

Install

Official marketplace

Find the One Theme in the Logseq in-app theme marketplace:

• Search for 'One Theme' in Menu → Plugins → Marketplace → Themes
• To select theme: Menu → Themes (or press t i)

Manual installation

Copy main.css contents into <graph_base>/logseq/custom.css

How to build

Install node

1. Clone repo

git clone https://github.com/femto-code/logseq-one-theme.git && cd logseq-one-theme

2. Install (development) dependencies (sass)

npm install

3. Run build

npm run build

Credits

This is a theme for Logseq - a privacy-first, open-source platform for knowledge management and collaboration under AGPL-3.0 license.

Thanks to the following creators for inspiration and reference:

• logseq-atmos-theme: Copyright (c) 2022 Matthias A. (MIT License)
  • (especially) banners integration, color palette, headers and dark code mirror theme
• logseq-bujo-theme: Copyright (c) 2022 Sergey Kolesnik (@stdword) (MIT License)
  • block-ref style and page-property icons
• logseq-awesome-content: Copyright (c) 2022 Yuriy Piskun (MIT License)
  • task and admonition block styles
• logseq-ozean-theme: Copyright (c) 2022 Yinghai Zhao (MIT License)
  • light codemirror theme
• logseq-mocha-theme: Copyright (c) 2021 BlueTeaFrog (MIT License)
  • page/block property container style and external link decoration

Issues & Feedback

Feel free to submit an issue. Contributions and suggestions to improve the theme are welcome!

---

Copyright © 2023 femto-code

MIT License