Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/cannibalox/logseq-dark-hpx

CSS snippets and themes for www.logseq.com
https://github.com/cannibalox/logseq-dark-hpx

Last synced: 4 months ago
JSON representation

CSS snippets and themes for www.logseq.com

Lists

README

        

# CSS snippets and themes for www.logseq.com:

- the *.user.css work with [Stylus](https://github.com/openstyles/stylus) extension for Chrome/FF/Opera
- the *.css snippets can be used with stylus (recommended) or directly added to your custom.css

## logseq-darker-hpx.user.css : [![Install directly with Stylus](https://img.shields.io/badge/Install%20directly%20with-Stylus-00adad.svg)](https://github.com/cannibalox/logseq-dark-hpx/raw/master/logseq-darker-hpx.user.css)
a dark theme for logseq with some extra features :
- external links have an icon
- journal pages : titles with icon
- styled tags as label boxes
- tags will have an emoji (#book📚, #movie🎞,#audio🎹, #games🕹, ...)
- add emoji for TODO 🔥 and DOING 🚧
- restyled code blocks so that the language tab is out of the way and easier to click
- fonts : Cairo (=Titillium web) and Teko
- new color palette, neutral background with more color contrast
- query block have a small 'query' label
- restyled tables
- journals page is more compact
- titles folding arrows are bigger easier to click
- scheduled timestands with Consolas monospace font
- restyled scrollbars
- less space around admonition blocks

to install inside a custom.css without stylus :
```
> remove the line `@-moz-document domain("logseq.com") {`
> remove the last `}` at the very end of the file
```

logseq darker hpx
![image](https://user-images.githubusercontent.com/4605693/106374143-a7604500-6380-11eb-888c-069bbb0d8848.png)
![Maxthon_WmZncUNvJr](https://user-images.githubusercontent.com/4605693/106373755-0cb23700-637d-11eb-85fd-98b5b9c2eeeb.png)

## logseq-colorful-indents.css
colorize the indentation lines
![vivaldi_iSYXCfTAaH](https://user-images.githubusercontent.com/4605693/106373513-898fe180-637a-11eb-807b-6a48b9c56268.png)
## logseq-columns-mod.css
a kanban/columns/cards layout. USE WITH STYLUS to enable it only when needed
![Maxthon_eXJTdZ5hhh](https://user-images.githubusercontent.com/4605693/106373490-4df51780-637a-11eb-8846-f14c4813cfc8.png)
## logseq-iconify-external-links.css
add a small icon near external links (aklready included in the theme)
## logseq-scroll-sidebar.css
restore the scrollbar on the right sidebar in addition to the main container scrollbar, makes it easier to navigate with pen-based systems without scroll wheels
## logseq-highlight-current-path.css
highlight the bullets of the current path
![MOPlO5raYZ](https://user-images.githubusercontent.com/4605693/108089216-a403d380-7079-11eb-9d41-04ba9da3613e.gif)
## logseq-dirty-focus-mode.css
fade out all lines except the current line. the parent block will be highlighted. useful for long documents with multiples levels. USE WITH STYLUS to be able to enable/disable it easily. I wouldn't activate that all the time.

# DEPRECATED THEMES
## (deprecated) dark-hpx version : [![Install directly with Stylus](https://img.shields.io/badge/Install%20directly%20with-Stylus-00adad.svg)](https://github.com/cannibalox/logseq-dark-hpx/raw/master/logseq-dark-hpx.user.css)

(Click the button to install the theme if you already have Stylus)
![image](https://user-images.githubusercontent.com/4605693/106373455-f0f96180-6379-11eb-9c15-b48e34eb2fa0.png)

## (deprecated) alternate color palette by Dale502 : [![Install directly with Stylus](https://img.shields.io/badge/Install%20directly%20with-Stylus-00adad.svg)](https://github.com/cannibalox/logseq-dark-hpx/raw/master/logseq-dark-dale502.user.css)

(Click the button to install the theme if you already have Stylus)
![image](https://user-images.githubusercontent.com/4605693/106373458-f8206f80-6379-11eb-9e8f-c648606fc610.png)

## INSTALLATION FAQ
### How to install Stylus
https://github.com/openstyles/stylus#releases
### How to install a Stylus theme
https://github.com/openstyles/stylus/wiki/Usercss#how-do-i-install-usercss