Zen Mode

approved

by paperbenni

Hide most UI elements.

★ 17 stars↓ 5,218 downloadsUpdated 1mo agoGPL-2.0
View on GitHub

Overview

An Obsidian Zen-Mode pluigin based on the Hider plugin.

This plugin enables you to hide most Obsidian UI to be able to focus on the content.

Changes in most recent version

  • Top bar is draggable in Zen mode
  • Added device-dependent "exit Zen mode" button option
  • Added "Full screen" option
  • Added "Hide properties" option
  • Added "Hide inline title" option
  • Added top/bottom padding options
  • Added focused file option

Why

Obsidian is by default unfit for content consumption or presentations. On mobile, viewing a PDF results in less than 40% of the screen being used for the PDF.

mobile_nozen

Zen Mode hides all UI Elements except the current text file or document, all that remains is a single button to restore all UI

mobile_zen

On desktop the problem is less severe, but there is still no way to quickly switch from an editing friendly experience to a viewing friendly experience. In addition to hiding all UI, zen mode also collapses and restores the side bars when being toggled.

desktop_nozen desktop_zen

Making your theme compatible with ZenMode

ZenMode injects the zenmode-active class on the body element when zen mode is active.

Development

  • pnpm install - Install dependencies
  • pnpm dev - Start development build in watch mode
  • pnpm build - Build production version
  • pnpm lint / pnpm lint:fix - Run linting
  • pnpm version minor/major/patch - Bump version

TODO

refactor CSS

  • lots of duplicate code
  • CSS formatter config?

For plugin developers

Search results and similarity scores are powered by semantic analysis of your plugin's README. If your plugin isn't appearing for searches you'd expect, try updating your README to clearly describe your plugin's purpose, features, and use cases.