diff --git a/README.md b/README.md index 7566a88..e635583 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,22 @@ # Stellar Dark Theme -Dark theme for Trilium Notes (https://github.com/zadam/trilium) +Dark theme for [Trilium Notes](https://github.com/zadam/trilium) + +## Features +### Native Styles +* High contrast +* Scrolling tables with sticky headers on both axes +* Vertical floating buttons that have much less overlap with content of notes +* Bright colors + +### Enhanced Addon Styles +*See 'Usage Instructions' for information on how to enable these.* +* Zen Mode +* Matching syntax highlight in text notes +* Position shown in TOC +* And much more! ## Usage Instructions +### Installation * Download the latest version of Trilium * Download the latest release of Stellar Dark * In your trilium instance right click a note you want to import the theme into @@ -11,10 +26,38 @@ Dark theme for Trilium Notes (https://github.com/zadam/trilium) * Under "Theme", choose Stellar Dark * Enjoy! +### Enabling Addon Features +#### Zen Mode +* Create a 'JS frontend' code note +* Add the `#widget` attribute to 'Owned Attributes' (the button with three lines and a checkmark) +* Add the following code (created by [Nriver]) to the note + ```js + api.addButtonToToolbar({ + title: 'Zen mode', + icon: 'spa', + action: function() { + $("body").toggleClass("zen-mode"); + }, + shortcut: 'alt+z' + }); + ``` +* Reload (`ctrl+r` or `F5`) Trilium to enable the script + +##### Usage +Press `alt+z` or the spa button in the launcher (left most panel) to enable/disable zen mode. + +There are two types of zen mode available: +1. Right panel enabled +2. Right panel disabled + +Right panel is enabled by default. If you would like to disable it, you can either add the following code in a new CSS note or uncomment it in the Stellar Dark theme as seen in the video below. +![Zen Mode](/screenshots/SD_Zen.mp4) + + ## Screenshots and Videos -![Theme Showcase](/screenshots/StellarDark_Screenshot.png) -![Showcase Backlinks and Map](/screenshots/Showcase_map.png) -![Showcase Colors on Options](/screenshots/Options.png) +![Text Showcase](/screenshots/SD_Main.png) +![Map Showcase](/screenshots/SD_Map.png) +![Code Showcase](/screenshots/SD_Code.png) ## Credits and Resources ### Fonts @@ -30,4 +73,4 @@ Dark theme for Trilium Notes (https://github.com/zadam/trilium) * WordCount (Featured in the [Demo Document](https://github.com/zadam/trilium/wiki/Document#demo-document)) * [Zen Mode](https://github.com/Nriver/awesome-trilium/issues/44) -Find more addons made by the Trilium community at [Nriver's Awesome Trilium](https://github.com/Nriver/awesome-trilium?tab=readme-ov-file#%EF%B8%8F-widgets)! +Find more addons made by the Trilium community at [Nriver's "Awesome Trilium" page](https://github.com/Nriver/awesome-trilium?tab=readme-ov-file#%EF%B8%8F-widgets)! diff --git a/screenshots/Options.png b/screenshots/Options.png deleted file mode 100644 index feb8a6f..0000000 Binary files a/screenshots/Options.png and /dev/null differ diff --git a/screenshots/SD_Code_Hover-2024-10-11_19.53.20.mp4 b/screenshots/SD_Code_Hover.mp4 similarity index 100% rename from screenshots/SD_Code_Hover-2024-10-11_19.53.20.mp4 rename to screenshots/SD_Code_Hover.mp4 diff --git a/screenshots/SD_Tables-2024-10-11_19.18.05.mp4 b/screenshots/SD_Tables.mp4 similarity index 100% rename from screenshots/SD_Tables-2024-10-11_19.18.05.mp4 rename to screenshots/SD_Tables.mp4 diff --git a/screenshots/SD_Zen-2024-10-11_18.28.03.mp4 b/screenshots/SD_Zen.mp4 similarity index 100% rename from screenshots/SD_Zen-2024-10-11_18.28.03.mp4 rename to screenshots/SD_Zen.mp4 diff --git a/screenshots/Showcase_map.png b/screenshots/Showcase_map.png deleted file mode 100644 index 1fda806..0000000 Binary files a/screenshots/Showcase_map.png and /dev/null differ diff --git a/screenshots/StellarDark_Screenshot.png b/screenshots/StellarDark_Screenshot.png deleted file mode 100644 index e16a10b..0000000 Binary files a/screenshots/StellarDark_Screenshot.png and /dev/null differ