Add more info, screenshots, and videos

This commit is contained in:
lolabird 2024-10-12 00:15:14 -06:00
commit ba4f9cb1d9
No known key found for this signature in database
GPG key ID: 91363E5F20E63A5B

View file

@ -1,11 +1,15 @@
# Stellar Dark Theme # Stellar Dark Theme
Dark theme for [Trilium Notes](https://github.com/zadam/trilium) Dark theme for [Trilium Notes](https://github.com/zadam/trilium)
![Text Showcase](/screenshots/SD_Main.png)
## Features ## Features
### Native Styles ### Native Styles
* Dark theme
* High contrast * High contrast
* Scrolling tables with sticky headers on both axes * Scrolling tables with sticky headers on both axes
* Vertical floating buttons that have much less overlap with content of notes * Vertical floating buttons that have much less overlap with content of notes
* Custom fonts
* Bright colors * Bright colors
### Enhanced Addon Styles ### Enhanced Addon Styles
@ -30,7 +34,7 @@ Dark theme for [Trilium Notes](https://github.com/zadam/trilium)
#### Zen Mode #### Zen Mode
* Create a 'JS frontend' code note * Create a 'JS frontend' code note
* Add the `#widget` attribute to 'Owned Attributes' (the button with three lines and a checkmark) * 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 * Add the following code (created by [Nriver](https://github.com/Nriver/awesome-trilium/issues/44))) to the note
```js ```js
api.addButtonToToolbar({ api.addButtonToToolbar({
title: 'Zen mode', title: 'Zen mode',
@ -44,21 +48,40 @@ Dark theme for [Trilium Notes](https://github.com/zadam/trilium)
* Reload (`ctrl+r` or `F5`) Trilium to enable the script * Reload (`ctrl+r` or `F5`) Trilium to enable the script
##### Usage ##### Usage
Press `alt+z` or the spa button in the launcher (left most panel) to enable/disable zen mode. Press `alt+z` or the zen (spa) button in the launcher (left most panel) to enable/disable zen mode.
There are two types of zen mode available: There are two types of zen mode available:
1. Right panel enabled 1. Right panel enabled
2. Right panel disabled 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. 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) ![Zen Mode](/screenshots/SD_Zen.mp4)
##### Added Features
* Window control buttons are still accessible in zen mode
* Zen button is still accessible in zen mode for easy disabling in case you don't remember the shortcut
* Bottom panel widgets are not visible in zen mode
* Optional disabling of right panel in zen mode
#### Show Position in TOC and Syntax Highlight
Please go to each addon's respective page for instructions on how to enable these addons.
* [Show Position in TOC](https://github.com/SiriusXT/trilium-show-position-in-toc)
* [Syntax Highlight](https://github.com/antoniotejada/Trilium-SyntaxHighlightWidget)
## Screenshots and Videos ## Screenshots and Videos
![Text Showcase](/screenshots/SD_Main.png) ![Selection Showcase](/screenshots/SD_Hover.png)
![Tables Showcase](/screenshots/SD_Tables.mp4)
![Map Showcase](/screenshots/SD_Map.png) ![Map Showcase](/screenshots/SD_Map.png)
![Code Showcase](/screenshots/SD_Code.png) ![Code Showcase](/screenshots/SD_Code.png)
![Code Selection Showcase](/screenshots/SD_Code_Hover.mp4)
![Text Note Syntax Highlight Showcase](/screenshots/SD_Highlight.png)
## Credits and Resources ## Credits and Resources
### Fonts ### Fonts
* [Fira](https://github.com/mozilla/Fira) * [Fira](https://github.com/mozilla/Fira)