mirror of
https://github.com/notion-enhancer/notion-enhancer.git
synced 2025-04-05 13:19:03 +00:00
documentation update (mainly images)
This commit is contained in:
parent
e9a45f7051
commit
3cc431c088
GPG Key ID:
C7A48B7846AA706D
@ -9,9 +9,14 @@ but can still easily be enabled by following instructions in the [docs](README.m
|
||||
- docs: font resizing.
|
||||
- docs: hide discussions (thanks to [u/Roosmaryn](https://www.reddit.com/user/Roosmaryn/))
|
||||
- new: custom colour theming, demonstrated via the dark+ theme.
|
||||
- new: linux support (thanks for [@Blacksuan19](https://github.com/Blacksuan19)).
|
||||
- improved: if hotkey is pressed while notion is unfocused, it will bring it to the front rather than hiding it.
|
||||
- bugfix: specify UTF-8 encoding to prevent multibyte/gbk codec errors (thanks to [@etnperlong](https://github.com/etnperlong))
|
||||
|
||||
//todo
|
||||
|
||||
- stop window buttons breaking at smaller widths
|
||||
|
||||
### v0.5.0 (2020-05-23)
|
||||
|
||||
- new: running from the wsl.
|
||||
|
||||
1
Pipfile
1
Pipfile
@ -8,6 +8,7 @@ pylint = "*"
|
||||
autopep8 = "*"
|
||||
|
||||
[packages]
|
||||
pyasar = "*"
|
||||
|
||||
[requires]
|
||||
python_version = "3.6"
|
||||
|
||||
35
Pipfile.lock
generated
35
Pipfile.lock
generated
@ -1,7 +1,7 @@
|
||||
{
|
||||
"_meta": {
|
||||
"hash": {
|
||||
"sha256": "3eeda9cee44e435fe2d016242e4f33fb3f938001bae135ea1618534a36c05e40"
|
||||
"sha256": "1acd8226b318eb2516f81421b7f90e7c81f2119805d658a5a958e0699a1358d6"
|
||||
},
|
||||
"pipfile-spec": 6,
|
||||
"requires": {
|
||||
@ -15,27 +15,37 @@
|
||||
}
|
||||
]
|
||||
},
|
||||
"default": {},
|
||||
"default": {
|
||||
"pyasar": {
|
||||
"hashes": [
|
||||
"sha256:f96b322ea5c450d129dbe6990e5ba827d1d070e818822c408abffa44058f7f08"
|
||||
],
|
||||
"index": "pypi",
|
||||
"version": "==1.0.8"
|
||||
}
|
||||
},
|
||||
"develop": {
|
||||
"astroid": {
|
||||
"hashes": [
|
||||
"sha256:4c17cea3e592c21b6e222f673868961bad77e1f985cb1694ed077475a89229c1",
|
||||
"sha256:d8506842a3faf734b81599c8b98dcc423de863adcc1999248480b18bd31a0f38"
|
||||
"sha256:2f4078c2a41bf377eea06d71c9d2ba4eb8f6b1af2135bec27bbbb7d8f12bb703",
|
||||
"sha256:bc58d83eb610252fd8de6363e39d4f1d0619c894b0ed24603b881c02e64c7386"
|
||||
],
|
||||
"version": "==2.4.1"
|
||||
"markers": "python_version >= '3.5'",
|
||||
"version": "==2.4.2"
|
||||
},
|
||||
"autopep8": {
|
||||
"hashes": [
|
||||
"sha256:152fd8fe47d02082be86e05001ec23d6f420086db56b17fc883f3f965fb34954"
|
||||
"sha256:60fd8c4341bab59963dafd5d2a566e94f547e660b9b396f772afe67d8481dbf0"
|
||||
],
|
||||
"index": "pypi",
|
||||
"version": "==1.5.2"
|
||||
"version": "==1.5.3"
|
||||
},
|
||||
"isort": {
|
||||
"hashes": [
|
||||
"sha256:54da7e92468955c4fceacd0c86bd0ec997b0e1ee80d97f67c35a78b719dccab1",
|
||||
"sha256:6e811fcb295968434526407adb8796944f1988c5b65e8139058f2014cbe100fd"
|
||||
],
|
||||
"markers": "python_version >= '2.7' and python_version not in '3.0, 3.1, 3.2, 3.3'",
|
||||
"version": "==4.3.21"
|
||||
},
|
||||
"lazy-object-proxy": {
|
||||
@ -62,6 +72,7 @@
|
||||
"sha256:efa1909120ce98bbb3777e8b6f92237f5d5c8ea6758efea36a473e1d38f7d3e4",
|
||||
"sha256:f3900e8a5de27447acbf900b4750b0ddfd7ec1ea7fbaf11dfa911141bc522af0"
|
||||
],
|
||||
"markers": "python_version >= '2.7' and python_version not in '3.0, 3.1, 3.2, 3.3'",
|
||||
"version": "==1.4.3"
|
||||
},
|
||||
"mccabe": {
|
||||
@ -76,21 +87,23 @@
|
||||
"sha256:2295e7b2f6b5bd100585ebcb1f616591b652db8a741695b3d8f5d28bdc934367",
|
||||
"sha256:c58a7d2815e0e8d7972bf1803331fb0152f867bd89adf8a01dfd55085434192e"
|
||||
],
|
||||
"markers": "python_version >= '2.7' and python_version not in '3.0, 3.1, 3.2, 3.3'",
|
||||
"version": "==2.6.0"
|
||||
},
|
||||
"pylint": {
|
||||
"hashes": [
|
||||
"sha256:b95e31850f3af163c2283ed40432f053acbc8fc6eba6a069cb518d9dbf71848c",
|
||||
"sha256:dd506acce0427e9e08fb87274bcaa953d38b50a58207170dbf5b36cf3e16957b"
|
||||
"sha256:7dd78437f2d8d019717dbf287772d0b2dbdfd13fc016aa7faa08d67bccc46adc",
|
||||
"sha256:d0ece7d223fe422088b0e8f13fa0a1e8eb745ebffcb8ed53d3e95394b6101a1c"
|
||||
],
|
||||
"index": "pypi",
|
||||
"version": "==2.5.2"
|
||||
"version": "==2.5.3"
|
||||
},
|
||||
"six": {
|
||||
"hashes": [
|
||||
"sha256:30639c035cdb23534cd4aa2dd52c3bf48f06e5f4a941509c8bafd8ce11080259",
|
||||
"sha256:8b74bedcbbbaca38ff6d7491d76f2b06b3592611af620f8426e82dddb04a5ced"
|
||||
],
|
||||
"markers": "python_version >= '2.7' and python_version not in '3.0, 3.1, 3.2, 3.3'",
|
||||
"version": "==1.15.0"
|
||||
},
|
||||
"toml": {
|
||||
@ -124,7 +137,7 @@
|
||||
"sha256:fc0fea399acb12edbf8a628ba8d2312f583bdbdb3335635db062fa98cf71fca4",
|
||||
"sha256:fe460b922ec15dd205595c9b5b99e2f056fd98ae8f9f56b888e7a17dc2b757e7"
|
||||
],
|
||||
"markers": "implementation_name == 'cpython' and python_version < '3.8'",
|
||||
"markers": "python_version < '3.8' and implementation_name == 'cpython'",
|
||||
"version": "==1.4.1"
|
||||
},
|
||||
"wrapt": {
|
||||
|
||||
57
README.md
57
README.md
@ -2,32 +2,40 @@
|
||||
|
||||
an enhancer/customiser for the all-in-one productivity workspace [notion.so](https://www.notion.so/)
|
||||
|
||||
_note: this is currently an unreleased version of the enhancer, which adds some cool things like colour theming and improves on some existing features. it is stable, and so has been pushed out for use. once i've done some more fine-tuning and finished taking screenshots of everything i will release this officially as v0.6.0._
|
||||
_note: this is currently an unreleased version of the enhancer, which adds some cool things_
|
||||
_like colour theming and improves on some existing features. it is stable,_
|
||||
_and so has been pushed out for use. once I've done some more fine-tuning_
|
||||
_and finished taking screenshots of everything I will release this officially as v0.6.0._
|
||||
|
||||
## installation
|
||||
|
||||
currently, both win10 and Linux are supported. it is possible to run this script via the wsl to modify the win10 notion app.
|
||||
currently, both windows and linux are supported. it is possible to run this script via the WSL to modify the windows notion app.
|
||||
|
||||
For Linux install notion from [here](https://github.com/jaredallard/notion-app). Or if you're using arch install [notion-app](https://aur.archlinux.org/packages/notion-app/) package from AUR.
|
||||
**want macOS to be supported too? let me know, and I can work with you to get it going.**
|
||||
|
||||
for linux users, the notion-app ([arch linux](https://aur.archlinux.org/packages/notion-app/),
|
||||
[others e.g. ubuntu](https://github.com/jaredallard/notion-app)) package will wrap/run the macOS version of the notion app with electron.
|
||||
|
||||
(the [styles](#styling) should also work for the web version.
|
||||
these can be installed via an extension like [stylus](https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne?hl=en)
|
||||
or a built-in feature like [userChrome.css](https://www.userchrome.org/).)
|
||||
|
||||
1. install [node.js](https://nodejs.org/en/) (if using the wsl, it is recommended to install via [nvm](https://github.com/nvm-sh/nvm#install--update-script)).
|
||||
2. install [python](https://www.python.org/) (if using the wsl, follow [this guide](https://docs.python-guide.org/starting/install3/linux/)).
|
||||
1. install node.js: [windows](https://nodejs.org/en/download/), [linux/WSL](https://github.com/mklement0/n-install).
|
||||
2. install python: [windows](https://www.python.org/downloads/windows/), [linux/WSL](https://docs.python-guide.org/starting/install3/linux/).
|
||||
3. reboot.
|
||||
4. in cmd (on windows) or bash (with wsl), run `npm install -g asar` (check installation by running `asar`).
|
||||
5. [download this enhancer](https://github.com/dragonwocky/notion-enhancer/archive/master.zip) & extract to a location it can safely remain (this must be in the windows filesystem,
|
||||
even if you are running the script from the wsl).
|
||||
6. ensure notion is closed.
|
||||
7. optional: to remove previous applications of the notion enhancer, run `cleaner.py`
|
||||
4. in the appropriate terminal/command line, run `npm install -g asar` (check installation by running `asar`).
|
||||
5. [download this enhancer](https://github.com/dragonwocky/notion-enhancer/archive/master.zip) & extract
|
||||
to a location it can safely remain (if running the script from the WSL, make sure this is from a location within the windows filesystem).
|
||||
6. ensure no notion processes are running - you may want to check the task manager to make sure.
|
||||
7. optional: to remove previous applications of the notion enhancer, run `cleaner.py`.
|
||||
8. optional: modify the `resources/user.css` file to your liking (see [styling](#styling)).
|
||||
9. run `customiser.py` to build changes. (for linux run with sudo)
|
||||
|
||||
done: run notion and enjoy.
|
||||
|
||||
**oh no, now my app won't open!**
|
||||
## faq
|
||||
|
||||
**now the notion app won't open :(**
|
||||
|
||||
1. kill any notion tasks in the task manager (`ctrl+shift+esc`).
|
||||
2. run `cleaner.py`.
|
||||
@ -36,15 +44,25 @@ done: run notion and enjoy.
|
||||
|
||||
**i tried opening the python file but it just closed instantly and nothing happened?**
|
||||
|
||||
python scripts must be run from the wsl terminal or windows command prompt via e.g. `python customiser.py`.
|
||||
python scripts must be run from the terminal or command prompt via e.g. `python customiser.py`.
|
||||
|
||||
**now that i've run the script, can i delete this folder?**
|
||||
**now that I've run the script, can I delete the enhancer folder?**
|
||||
|
||||
no! user style files `resources/user.css` and `resources/theme.css` are fetched from here each time you open notion.
|
||||
additionally, if you ever need to change or reset your notion build, the `customiser.py` and `cleaner.py` files will be useful.
|
||||
|
||||
unless you're sure you know what you're doing (if you have to ask, you probably don't) then do not delete anything.
|
||||
|
||||
**something isn't working, and the suggestions here haven't fixed it...**
|
||||
|
||||
this is probably a bug. please submit a
|
||||
[bug report](https://github.com/dragonwocky/notion-enhancer/issues/new?assignees=&labels=bug&template=bug-report.md&title=).
|
||||
|
||||
**I have a new feature idea for the enhancer!**
|
||||
|
||||
experienced problems with the notion app, or just want to add something a bit more to it? please submit a
|
||||
[feature request](https://github.com/dragonwocky/notion-enhancer/issues/new?assignees=&labels=enhancement&template=feature-request.md&title=).
|
||||
|
||||
## features
|
||||
|
||||
### titlebar
|
||||
@ -66,10 +84,10 @@ ones that actually look as if they're part of notion.
|
||||
|
||||
to add these to the web version, copy lines 44 - 75 from `user.css` into your css customiser.
|
||||
|
||||
|
||||
|
||||
_image: before enhancement_
|
||||
|
||||
|
||||
|
||||
_image: after default enhancement_
|
||||
|
||||
### hotkeys
|
||||
@ -85,8 +103,6 @@ to your preference. you will need to run or re-run `customiser.py` afterwards.
|
||||
|
||||
single-click to toggle app visibility. right click to open menu.
|
||||
|
||||
settings will be saved in `%localappdata%/Programs/Notion/resources/app/user-preferences.json`
|
||||
|
||||
- **run on startup**: run notion on boot/startup. (default: true)
|
||||
- **hide on open**: hide the launch of notion to the tray. (default: false)
|
||||
- **open maximised**: maximise the app on open. (default: false)
|
||||
@ -95,7 +111,7 @@ settings will be saved in `%localappdata%/Programs/Notion/resources/app/user-pre
|
||||
- **load theme.css**: loads the custom colour theme file.
|
||||
see [colour theming](STYLING.md#colour-theming) for more information. (default: false)
|
||||
|
||||
|
||||
|
||||
_image: open application tray_
|
||||
|
||||
## styling
|
||||
@ -103,15 +119,12 @@ _image: open application tray_
|
||||
custom appearances can be applied to the app via the `resources/user.css` and `resources/theme.css` files. for more information,
|
||||
and a list of various optional styling changes, see [the page on styling](STYLING.md).
|
||||
|
||||
## this is a fork
|
||||
## other details
|
||||
|
||||
credit where credit is due, this was originally made by Uzver (github: [@TarasokUA](https://github.com/TarasokUA),
|
||||
telegram: [UserFromUkraine](https://t.me/UserFromUkraine), discord: Uzver#8760).
|
||||
|
||||
he has approved my go-ahead with this fork, as he himself no longer wishes to continue development on the project.
|
||||
|
||||
## other details
|
||||
|
||||
the notion logo belongs entirely to the notion team, and was sourced from their
|
||||
[media kit](https://www.notion.so/Media-Kit-205535b1d9c4440497a3d7a2ac096286).
|
||||
|
||||
|
||||
172
STYLING.md
172
STYLING.md
@ -14,7 +14,12 @@ these should also work for the web version, if copied into your css customiser.
|
||||
|
||||
css below will work for every instance of the element, but if you wish to hide only a specific element
|
||||
(e.g. the '+ new' table row) it is recommended that you prepend each selector with
|
||||
`[data-block-id='ID']` ([video tutorial on fetching IDs](https://www.youtube.com/watch?v=6V7eqShm_4w)).
|
||||
`[data-block-id='ID']`.
|
||||
|
||||
## general/app-wide
|
||||
|
||||
|
||||
_image: the default post-customisation appearance_
|
||||
|
||||
### colour theming
|
||||
|
||||
@ -27,7 +32,7 @@ to enable, see the [tray](README.md#tray) options.
|
||||
to modify, enter the `theme.css` file and change the colour values within the `:root {}` - value names
|
||||
should describe what each colour will affect.
|
||||
|
||||
|
||||
|
||||
_image: the dark+ theme_
|
||||
|
||||
### hide discussions (comment threads at the top of each page)
|
||||
@ -38,18 +43,18 @@ _image: the dark+ theme_
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
_image: before_
|
||||
|
||||
_image: before styling_
|
||||
|
||||
|
||||
_image: after_
|
||||
|
||||
_image: after styling_
|
||||
|
||||
### custom fonts
|
||||
|
||||
**the `@import` statement must be added to the top of the file (with nothing above it**
|
||||
**except comments or other `@import` statements)**
|
||||
|
||||
to change the fonts, change the font-family property. there are
|
||||
to change the fonts, put the relevant URL in the `@import` statement and then change the [font-family](https://developer.mozilla.org/en-US/docs/Web/CSS/font-family) property.
|
||||
plenty of other fonts that can be found on google fonts or that may be on your system already.
|
||||
|
||||
```css
|
||||
@ -65,11 +70,8 @@ plenty of other fonts that can be found on google fonts or that may be on your s
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
_image: before_
|
||||
|
||||
|
||||
_image: after_
|
||||
|
||||
_image: after styling_
|
||||
|
||||
### font resizing
|
||||
|
||||
@ -105,8 +107,8 @@ to change the size, change the value of `--font-scale`.
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
_image: after_
|
||||
|
||||
_image: after styling_
|
||||
|
||||
### wider page preview
|
||||
|
||||
@ -116,11 +118,11 @@ _image: after_
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
_image: before_
|
||||
|
||||
_image: before styling_
|
||||
|
||||
|
||||
_image: after_
|
||||
|
||||
_image: after styling_
|
||||
|
||||
### thinner cover image
|
||||
|
||||
@ -134,37 +136,46 @@ _image: after_
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
_image: before_
|
||||
|
||||
_image: before styling_
|
||||
|
||||
|
||||
_image: after_
|
||||
|
||||
_image: after styling_
|
||||
|
||||
## tables
|
||||
|
||||
|
||||
_image: before styling_
|
||||
|
||||
### table columns below 100px
|
||||
|
||||
**not recommended!** this is unreliable and will cause bugs.
|
||||
coincidentally, this is also what the youtube video linked above shows how to do.
|
||||
as it is a per-table-column style, unlike all others here, it must be prepended with the block ID.
|
||||
**not recommended!** this may cause buggy viewing.
|
||||
as it is a per-table-column style, unlike all others here, it must be prepended with the block ID and repeated for each column.
|
||||
|
||||
to see how to do this, watch [this video](https://www.youtube.com/watch?v=6V7eqShm_4w).
|
||||
|
||||
```css
|
||||
[data-block-id^='ID']
|
||||
[data-block-id^='tableID']
|
||||
> [style^='display: flex; position: absolute; background: rgb(47, 52, 55); z-index: 82; height: 33px; color: rgba(255, 255, 255, 0.6);']
|
||||
> div:nth-child(1)
|
||||
> div:nth-child(10)
|
||||
> div:nth-child(COL_NUMBER)
|
||||
> div:nth-child(1),
|
||||
[data-block-id^='ID']
|
||||
[data-block-id^='tableID']
|
||||
> [style^='position: relative; min-width: calc(100% - 192px);']
|
||||
> [data-block-id]
|
||||
> div:nth-child(10),
|
||||
[data-block-id^='ID'] > div:nth-child(5) > div:nth-child(10) {
|
||||
width: 45px !important;
|
||||
> div:nth-child(COL_NUMBER),
|
||||
[data-block-id^='tableID'] > div:nth-child(5) > div:nth-child(COL_NUMBER) {
|
||||
width: 32px !important;
|
||||
}
|
||||
[data-block-id^='ID']
|
||||
[data-block-id^='tableID']
|
||||
[style^='position: absolute; top: 0px; left: 0px; pointer-events: none;']:not(.notion-presence-container) {
|
||||
display: none;
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
_image: after styling_
|
||||
|
||||
### hide '+ new' table row
|
||||
|
||||
```css
|
||||
@ -173,11 +184,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
_image: before_
|
||||
|
||||
|
||||
_image: after_
|
||||
|
||||
_image: after styling_
|
||||
|
||||
### hide calculations table row
|
||||
|
||||
@ -187,38 +195,8 @@ _image: after_
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
_image: before_
|
||||
|
||||
|
||||
_image: after_
|
||||
|
||||
### hide '+ new' board row
|
||||
|
||||
```css
|
||||
.notion-board-group
|
||||
[style='user-select: none; transition: background 120ms ease-in 0s; cursor: pointer; display: inline-flex; align-items: center; flex-shrink: 0; white-space: nowrap; height: 32px; border-radius: 3px; font-size: 14px; line-height: 1.2; min-width: 0px; padding-left: 6px; padding-right: 8px; color: rgba(255, 255, 255, 0.4); width: 100%;'] {
|
||||
display: none !important;
|
||||
}
|
||||
```
|
||||
|
||||
### hide board view hidden columns
|
||||
|
||||
```css
|
||||
.notion-board-view > [data-block-id] > div:nth-last-child(2),
|
||||
.notion-board-view > [data-block-id] > div:first-child > div:nth-last-child(2) {
|
||||
display: none !important;
|
||||
}
|
||||
```
|
||||
|
||||
### hide board view 'add a group'
|
||||
|
||||
```css
|
||||
.notion-board-view > [data-block-id] > div:last-child,
|
||||
.notion-board-view > [data-block-id] > div:first-child > div:last-child {
|
||||
display: none !important;
|
||||
}
|
||||
```
|
||||
|
||||
_image: after styling_
|
||||
|
||||
### centre-align table column headers
|
||||
|
||||
@ -228,6 +206,9 @@ _image: after_
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
_image: after styling_
|
||||
|
||||
### smaller table column header icons
|
||||
|
||||
```css
|
||||
@ -240,6 +221,9 @@ _image: after_
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
_image: after styling_
|
||||
|
||||
### remove icons from table column headers
|
||||
|
||||
```css
|
||||
@ -248,6 +232,9 @@ _image: after_
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
_image: after styling_
|
||||
|
||||
### removing/decreasing side padding for tables
|
||||
|
||||
```css
|
||||
@ -266,6 +253,50 @@ _image: after_
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
_image: after styling_
|
||||
|
||||
## boards
|
||||
|
||||
|
||||
_image: before styling_
|
||||
|
||||
### hide '+ new' board row
|
||||
|
||||
```css
|
||||
.notion-board-group
|
||||
[style='user-select: none; transition: background 120ms ease-in 0s; cursor: pointer; display: inline-flex; align-items: center; flex-shrink: 0; white-space: nowrap; height: 32px; border-radius: 3px; font-size: 14px; line-height: 1.2; min-width: 0px; padding-left: 6px; padding-right: 8px; color: rgba(255, 255, 255, 0.4); width: 100%;'] {
|
||||
display: none !important;
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
_image: after styling_
|
||||
|
||||
### hide board view hidden columns
|
||||
|
||||
```css
|
||||
.notion-board-view > [data-block-id] > div:nth-last-child(2),
|
||||
.notion-board-view > [data-block-id] > div:first-child > div:nth-last-child(2) {
|
||||
display: none !important;
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
_image: after styling_
|
||||
|
||||
### hide board view 'add a group'
|
||||
|
||||
```css
|
||||
.notion-board-view > [data-block-id] > div:last-child,
|
||||
.notion-board-view > [data-block-id] > div:first-child > div:last-child {
|
||||
display: none !important;
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
_image: after styling_
|
||||
|
||||
### removing/decreasing side padding for boards
|
||||
|
||||
```css
|
||||
@ -274,3 +305,6 @@ _image: after_
|
||||
padding-right: 10px !important;
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
_image: after styling_
|
||||
|
||||
3
docs/.vscode/settings.json
vendored
3
docs/.vscode/settings.json
vendored
@ -1,3 +0,0 @@
|
||||
{
|
||||
"python.pythonPath": "/home/dragonwocky/.local/share/virtualenvs/notion-enhancer-Hp9dv90P/bin/python"
|
||||
}
|
||||
@ -8,6 +8,7 @@ pylint = "*"
|
||||
autopep8 = "*"
|
||||
|
||||
[packages]
|
||||
pyasar = "*"
|
||||
|
||||
[requires]
|
||||
python_version = "3.6"
|
||||
|
||||
35
docs/Pipfile.lock
generated
35
docs/Pipfile.lock
generated
@ -1,7 +1,7 @@
|
||||
{
|
||||
"_meta": {
|
||||
"hash": {
|
||||
"sha256": "3eeda9cee44e435fe2d016242e4f33fb3f938001bae135ea1618534a36c05e40"
|
||||
"sha256": "1acd8226b318eb2516f81421b7f90e7c81f2119805d658a5a958e0699a1358d6"
|
||||
},
|
||||
"pipfile-spec": 6,
|
||||
"requires": {
|
||||
@ -15,27 +15,37 @@
|
||||
}
|
||||
]
|
||||
},
|
||||
"default": {},
|
||||
"default": {
|
||||
"pyasar": {
|
||||
"hashes": [
|
||||
"sha256:f96b322ea5c450d129dbe6990e5ba827d1d070e818822c408abffa44058f7f08"
|
||||
],
|
||||
"index": "pypi",
|
||||
"version": "==1.0.8"
|
||||
}
|
||||
},
|
||||
"develop": {
|
||||
"astroid": {
|
||||
"hashes": [
|
||||
"sha256:4c17cea3e592c21b6e222f673868961bad77e1f985cb1694ed077475a89229c1",
|
||||
"sha256:d8506842a3faf734b81599c8b98dcc423de863adcc1999248480b18bd31a0f38"
|
||||
"sha256:2f4078c2a41bf377eea06d71c9d2ba4eb8f6b1af2135bec27bbbb7d8f12bb703",
|
||||
"sha256:bc58d83eb610252fd8de6363e39d4f1d0619c894b0ed24603b881c02e64c7386"
|
||||
],
|
||||
"version": "==2.4.1"
|
||||
"markers": "python_version >= '3.5'",
|
||||
"version": "==2.4.2"
|
||||
},
|
||||
"autopep8": {
|
||||
"hashes": [
|
||||
"sha256:152fd8fe47d02082be86e05001ec23d6f420086db56b17fc883f3f965fb34954"
|
||||
"sha256:60fd8c4341bab59963dafd5d2a566e94f547e660b9b396f772afe67d8481dbf0"
|
||||
],
|
||||
"index": "pypi",
|
||||
"version": "==1.5.2"
|
||||
"version": "==1.5.3"
|
||||
},
|
||||
"isort": {
|
||||
"hashes": [
|
||||
"sha256:54da7e92468955c4fceacd0c86bd0ec997b0e1ee80d97f67c35a78b719dccab1",
|
||||
"sha256:6e811fcb295968434526407adb8796944f1988c5b65e8139058f2014cbe100fd"
|
||||
],
|
||||
"markers": "python_version >= '2.7' and python_version not in '3.0, 3.1, 3.2, 3.3'",
|
||||
"version": "==4.3.21"
|
||||
},
|
||||
"lazy-object-proxy": {
|
||||
@ -62,6 +72,7 @@
|
||||
"sha256:efa1909120ce98bbb3777e8b6f92237f5d5c8ea6758efea36a473e1d38f7d3e4",
|
||||
"sha256:f3900e8a5de27447acbf900b4750b0ddfd7ec1ea7fbaf11dfa911141bc522af0"
|
||||
],
|
||||
"markers": "python_version >= '2.7' and python_version not in '3.0, 3.1, 3.2, 3.3'",
|
||||
"version": "==1.4.3"
|
||||
},
|
||||
"mccabe": {
|
||||
@ -76,21 +87,23 @@
|
||||
"sha256:2295e7b2f6b5bd100585ebcb1f616591b652db8a741695b3d8f5d28bdc934367",
|
||||
"sha256:c58a7d2815e0e8d7972bf1803331fb0152f867bd89adf8a01dfd55085434192e"
|
||||
],
|
||||
"markers": "python_version >= '2.7' and python_version not in '3.0, 3.1, 3.2, 3.3'",
|
||||
"version": "==2.6.0"
|
||||
},
|
||||
"pylint": {
|
||||
"hashes": [
|
||||
"sha256:b95e31850f3af163c2283ed40432f053acbc8fc6eba6a069cb518d9dbf71848c",
|
||||
"sha256:dd506acce0427e9e08fb87274bcaa953d38b50a58207170dbf5b36cf3e16957b"
|
||||
"sha256:7dd78437f2d8d019717dbf287772d0b2dbdfd13fc016aa7faa08d67bccc46adc",
|
||||
"sha256:d0ece7d223fe422088b0e8f13fa0a1e8eb745ebffcb8ed53d3e95394b6101a1c"
|
||||
],
|
||||
"index": "pypi",
|
||||
"version": "==2.5.2"
|
||||
"version": "==2.5.3"
|
||||
},
|
||||
"six": {
|
||||
"hashes": [
|
||||
"sha256:30639c035cdb23534cd4aa2dd52c3bf48f06e5f4a941509c8bafd8ce11080259",
|
||||
"sha256:8b74bedcbbbaca38ff6d7491d76f2b06b3592611af620f8426e82dddb04a5ced"
|
||||
],
|
||||
"markers": "python_version >= '2.7' and python_version not in '3.0, 3.1, 3.2, 3.3'",
|
||||
"version": "==1.15.0"
|
||||
},
|
||||
"toml": {
|
||||
@ -124,7 +137,7 @@
|
||||
"sha256:fc0fea399acb12edbf8a628ba8d2312f583bdbdb3335635db062fa98cf71fca4",
|
||||
"sha256:fe460b922ec15dd205595c9b5b99e2f056fd98ae8f9f56b888e7a17dc2b757e7"
|
||||
],
|
||||
"markers": "implementation_name == 'cpython' and python_version < '3.8'",
|
||||
"markers": "python_version < '3.8' and implementation_name == 'cpython'",
|
||||
"version": "==1.4.1"
|
||||
},
|
||||
"wrapt": {
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
<a href="#changelog">changelog</a>
|
||||
</h1>
|
||||
<p>if something is <del>crossed out</del>, then it is no longer a feature included by default,
|
||||
but can still easily be enabled by following instructions in the <a href="/index.html">docs</a>.</p>
|
||||
but can still easily be enabled by following instructions in the <a href="index.html#" title="">docs</a>.</p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="v060-wip">
|
||||
@ -15,10 +15,15 @@ but can still easily be enabled by following instructions in the <a href="/index
|
||||
<ul>
|
||||
<li>docs: custom fonts.</li>
|
||||
<li>docs: font resizing.</li>
|
||||
<li>docs: hide discussions (thanks to <a href="https://www.reddit.com/user/Roosmaryn/">u/Roosmaryn</a>)</li>
|
||||
<li>docs: hide discussions (thanks to <a href="https://www.reddit.com/user/Roosmaryn/#" title="">u/Roosmaryn</a>)</li>
|
||||
<li>new: custom colour theming, demonstrated via the dark+ theme.</li>
|
||||
<li>new: linux support (thanks for <a href="https://github.com/Blacksuan19#" title="">@Blacksuan19</a>).</li>
|
||||
<li>improved: if hotkey is pressed while notion is unfocused, it will bring it to the front rather than hiding it.</li>
|
||||
<li>bugfix: specify UTF-8 encoding to prevent multibyte/gbk codec errors (thanks to <a href="https://github.com/etnperlong">@etnperlong</a>)</li>
|
||||
<li>bugfix: specify UTF-8 encoding to prevent multibyte/gbk codec errors (thanks to <a href="https://github.com/etnperlong#" title="">@etnperlong</a>)</li>
|
||||
</ul>
|
||||
<p>//todo</p>
|
||||
<ul>
|
||||
<li>stop window buttons breaking at smaller widths</li>
|
||||
</ul>
|
||||
|
||||
</section>
|
||||
@ -35,7 +40,7 @@ a run of <code>cleaner.py</code> to build modifications.
|
||||
improved: scrollbar colours that fit better with notion's theming.</li>
|
||||
<li>bugfix: un-break having multiple notion windows open.</li>
|
||||
</ul>
|
||||
<p><em>(forked by <a href="https://github.com/dragonwocky">@dragonwocky</a>.)</em></p>
|
||||
<p><em>(forked by <a href="https://github.com/dragonwocky#" title="">@dragonwocky</a>.)</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="v041-2020-02-13">
|
||||
@ -46,7 +51,7 @@ improved: scrollbar colours that fit better with notion's theming.</li>
|
||||
<li>bugfix: wider table & the "+" button not working in database pages.</li>
|
||||
</ul>
|
||||
<blockquote>
|
||||
<p>📥 <a href="https://s3-us-west-2.amazonaws.com/secure.notion-static.com/d239a3cf-d553-4ef3-ab04-8b47892d9f9a/Notion_Customization_v4.1.zip">notion-enhancer.v4.1.zip</a></p>
|
||||
<p>📥 <a href="https://s3-us-west-2.amazonaws.com/secure.notion-static.com/d239a3cf-d553-4ef3-ab04-8b47892d9f9a/Notion_Customization_v4.1.zip#" title="">notion-enhancer.v4.1.zip</a></p>
|
||||
</blockquote>
|
||||
|
||||
</section>
|
||||
@ -74,7 +79,7 @@ improved: scrollbar colours that fit better with notion's theming.</li>
|
||||
<li><del>style: smaller table icons.</del></li>
|
||||
</ul>
|
||||
<blockquote>
|
||||
<p>📥 <a href="https://s3-us-west-2.amazonaws.com/secure.notion-static.com/b01aa446-5727-476a-a25e-395472bfb1be/NotionScriptsV3.zip">notion-enhancer.v3.zip</a></p>
|
||||
<p>📥 <a href="https://s3-us-west-2.amazonaws.com/secure.notion-static.com/b01aa446-5727-476a-a25e-395472bfb1be/NotionScriptsV3.zip#" title="">notion-enhancer.v3.zip</a></p>
|
||||
</blockquote>
|
||||
|
||||
</section>
|
||||
|
||||
@ -289,14 +289,14 @@ aside .mark a {
|
||||
color: var(--link);
|
||||
text-shadow: 0 0 0.75em var(--glow);
|
||||
}
|
||||
.wrapper .documentative img {
|
||||
max-width: 100%;
|
||||
}
|
||||
.wrapper .documentative blockquote {
|
||||
margin-left: 0;
|
||||
padding-left: 1em;
|
||||
border-left: 0.25em solid var(--border);
|
||||
}
|
||||
.wrapper .documentative img {
|
||||
max-width: 100%;
|
||||
}
|
||||
.wrapper .documentative h1 + table,
|
||||
.wrapper .documentative h2 + table,
|
||||
.wrapper .documentative h3 + table,
|
||||
@ -498,6 +498,4 @@ aside .mark a {
|
||||
.hljs-strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
.documentative pre .lang-css::before {
|
||||
content: 'CSS';
|
||||
}
|
||||
.documentative pre .lang-css::before { content: 'CSS'; }
|
||||
@ -1,49 +1,65 @@
|
||||
<!DOCTYPE html><!-- Documentative--><!-- (c) 2020 dragonwocky <thedragonring.bod@gmail.com>--><!-- (https://dragonwocky.me/) under the MIT license--><html prefix="og: http://ogp.me/ns#"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>notion enhancer</title><link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Code+Pro|Nunito+Sans"><link rel="stylesheet" href="docs.css"><script src="docs.js"></script><link rel="icon" href="web-logo.png" media="(prefers-color-scheme: dark)"><link rel="icon" href="web-logo.png"><meta name="title" content="notion enhancer"><meta name="description" content="an enhancer/customiser for the all-in-one productivity workspace notion.so"><meta name="theme-color" content="rgb(75, 133, 209)"><meta property="og:type" content="article"><meta property="og:url" content="https://dragonwocky.me/notion-enhancer/index.html"><meta property="og:title" content="notion enhancer"><meta property="og:site_name" content="notion enhancer"><meta property="og:description" content="an enhancer/customiser for the all-in-one productivity workspace notion.so"><meta property="og:image" content="https://dragonwocky.me/notion-enhancer/web-logo.png"><meta property="twitter:card" content="summary"></head><body><aside class="menu"><div><div class="title"><h1>notion enhancer</h1><picture class="icon"><source srcset="web-logo.png" media="(prefers-color-scheme: dark)"><img src="web-logo.png"></picture></div></div><ul class="nav"><li class="entry"><a href="#notion-enhancer">notion enhancer</a><ul><li class="level-2"><a href="#installation">installation</a></li><li class="level-2"><a href="#features">features</a></li><li class="level-3"><a href="#titlebar">titlebar</a></li><li class="level-3"><a href="#nicer-scrollbars">nicer scrollbars</a></li><li class="level-3"><a href="#hotkeys">hotkeys</a></li><li class="level-3"><a href="#tray">tray</a></li><li class="level-2"><a href="#styling">styling</a></li><li class="level-2"><a href="#this-is-a-fork">this is a fork</a></li><li class="level-2"><a href="#other-details">other details</a></li></ul></li><li class="entry"><a href="styling.html">styling</a></li><li class="entry"><p>resources</p></li><li class="entry"><a href="changelog.html">changelog</a></li><li class="entry"><a href="https://github.com/dragonwocky/notion-enhancer/blob/master/LICENSE">license</a></li><li class="entry"><a href="https://github.com/dragonwocky/notion-enhancer/">github</a></li><li class="entry"><a href="https://dragonwocky.me/">me (dragonwocky)</a></li></ul><p class="mark"><a href="https://dragonwocky.me/documentative">docs by documentative</a></p></aside><div class="wrapper"><div class="toggle"><button>☰</button><h1>notion enhancer</h1></div><article class="documentative"><div class="content">
|
||||
<!DOCTYPE html><!-- Documentative--><!-- (c) 2020 dragonwocky <thedragonring.bod@gmail.com>--><!-- (https://dragonwocky.me/) under the MIT license--><html prefix="og: http://ogp.me/ns#"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>notion enhancer</title><link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Code+Pro|Nunito+Sans"><link rel="stylesheet" href="docs.css"><script src="docs.js"></script><link rel="icon" href="web-logo.png" media="(prefers-color-scheme: dark)"><link rel="icon" href="web-logo.png"><meta name="title" content="notion enhancer"><meta name="description" content="an enhancer/customiser for the all-in-one productivity workspace notion.so"><meta name="theme-color" content="rgb(75, 133, 209)"><meta property="og:type" content="article"><meta property="og:url" content="https://dragonwocky.me/notion-enhancer/index.html"><meta property="og:title" content="notion enhancer"><meta property="og:site_name" content="notion enhancer"><meta property="og:description" content="an enhancer/customiser for the all-in-one productivity workspace notion.so"><meta property="og:image" content="https://dragonwocky.me/notion-enhancer/web-logo.png"><meta property="twitter:card" content="summary"></head><body><aside class="menu"><div><div class="title"><h1>notion enhancer</h1><picture class="icon"><source srcset="web-logo.png" media="(prefers-color-scheme: dark)"><img src="web-logo.png"></picture></div></div><ul class="nav"><li class="entry"><a href="#notion-enhancer">notion enhancer</a><ul><li class="level-2"><a href="#installation">installation</a></li><li class="level-2"><a href="#faq">faq</a></li><li class="level-2"><a href="#features">features</a></li><li class="level-3"><a href="#titlebar">titlebar</a></li><li class="level-3"><a href="#nicer-scrollbars">nicer scrollbars</a></li><li class="level-3"><a href="#hotkeys">hotkeys</a></li><li class="level-3"><a href="#tray">tray</a></li><li class="level-2"><a href="#styling">styling</a></li><li class="level-2"><a href="#other-details">other details</a></li></ul></li><li class="entry"><a href="styling.html">styling</a></li><li class="entry"><p>resources</p></li><li class="entry"><a href="changelog.html">changelog</a></li><li class="entry"><a href="https://github.com/dragonwocky/notion-enhancer/blob/master/LICENSE">license</a></li><li class="entry"><a href="https://github.com/dragonwocky/notion-enhancer/">github</a></li><li class="entry"><a href="https://dragonwocky.me/">me (dragonwocky)</a></li></ul><p class="mark"><a href="https://dragonwocky.me/documentative">docs by documentative</a></p></aside><div class="wrapper"><div class="toggle"><button>☰</button><h1>notion enhancer</h1></div><article class="documentative"><div class="content">
|
||||
|
||||
<section class="block" id="notion-enhancer">
|
||||
<h1>
|
||||
<a href="#notion-enhancer">notion enhancer</a>
|
||||
</h1>
|
||||
<p>an enhancer/customiser for the all-in-one productivity workspace <a href="https://www.notion.so/">notion.so</a></p>
|
||||
<p><em>note: this is currently an unreleased version of the enhancer, which adds some cool things like colour theming and improves on some existing features. it is stable, and so has been pushed out for use. once i've done some more fine-tuning and finished taking screenshots of everything i will release this officially as v0.6.0.</em></p>
|
||||
<p>an enhancer/customiser for the all-in-one productivity workspace <a href="https://www.notion.so/#" title="">notion.so</a></p>
|
||||
<p><em>note: this is currently an unreleased version of the enhancer, which adds some cool things</em>
|
||||
<em>like colour theming and improves on some existing features. it is stable,</em>
|
||||
<em>and so has been pushed out for use. once I've done some more fine-tuning</em>
|
||||
<em>and finished taking screenshots of everything I will release this officially as v0.6.0.</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="installation">
|
||||
<h2>
|
||||
<a href="#installation">installation</a>
|
||||
</h2>
|
||||
<p>currently, only win10 is supported. it is possible to run this script via the wsl to modify the win10 notion app.</p>
|
||||
<p>(the <a href="#styling">styles</a> should also work for the web version.
|
||||
these can be installed via an extension like <a href="https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne?hl=en">stylus</a>
|
||||
or a built-in feature like <a href="https://www.userchrome.org/">userChrome.css</a>.)</p>
|
||||
<p>currently, both windows and linux are supported. it is possible to run this script via the WSL to modify the windows notion app.</p>
|
||||
<p><strong>want macOS to be supported too? let me know, and I can work with you to get it going.</strong></p>
|
||||
<p>for linux users, the notion-app (<a href="https://aur.archlinux.org/packages/notion-app/#" title="">arch linux</a>,
|
||||
<a href="https://github.com/jaredallard/notion-app#" title="">others e.g. ubuntu</a>) package will wrap/run the macOS version of the notion app with electron.</p>
|
||||
<p>(the <a href="#styling" title="">styles</a> should also work for the web version.
|
||||
these can be installed via an extension like <a href="https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne?hl=en#" title="">stylus</a>
|
||||
or a built-in feature like <a href="https://www.userchrome.org/#" title="">userChrome.css</a>.)</p>
|
||||
<ol>
|
||||
<li>install <a href="https://nodejs.org/en/">node.js</a> (if using the wsl, it is recommended to install via <a href="https://github.com/nvm-sh/nvm#install--update-script">nvm</a>).</li>
|
||||
<li>install <a href="https://www.python.org/">python</a> (if using the wsl, follow <a href="https://docs.python-guide.org/starting/install3/linux/">this guide</a>).</li>
|
||||
<li>install node.js: <a href="https://nodejs.org/en/download/#" title="">windows</a>, <a href="https://github.com/mklement0/n-install#" title="">linux/WSL</a>.</li>
|
||||
<li>install python: <a href="https://www.python.org/downloads/windows/#" title="">windows</a>, <a href="https://docs.python-guide.org/starting/install3/linux/#" title="">linux/WSL</a>.</li>
|
||||
<li>reboot.</li>
|
||||
<li>in cmd (on windows) or bash (with wsl), run <code>npm install -g asar</code> (check installation by running <code>asar</code>).</li>
|
||||
<li><a href="https://github.com/dragonwocky/notion-enhancer/archive/master.zip">download this enhancer</a> & extract to a location it can safely remain (this must be in the windows filesystem,
|
||||
even if you are running the script from the wsl).</li>
|
||||
<li>ensure notion is closed.</li>
|
||||
<li>optional: to remove previous versions of notion enhancer, run <code>cleaner.py</code></li>
|
||||
<li>optional: modify the <code>resources/user.css</code> file to your liking (see <a href="#styling">styling</a>).</li>
|
||||
<li>run <code>customiser.py</code> to build changes.</li>
|
||||
<li>in the appropriate terminal/command line, run <code>npm install -g asar</code> (check installation by running <code>asar</code>).</li>
|
||||
<li><a href="https://github.com/dragonwocky/notion-enhancer/archive/master.zip#" title="">download this enhancer</a> & extract
|
||||
to a location it can safely remain (if running the script from the WSL, make sure this is from a location within the windows filesystem).</li>
|
||||
<li>ensure no notion processes are running - you may want to check the task manager to make sure.</li>
|
||||
<li>optional: to remove previous applications of the notion enhancer, run <code>cleaner.py</code>.</li>
|
||||
<li>optional: modify the <code>resources/user.css</code> file to your liking (see <a href="#styling" title="">styling</a>).</li>
|
||||
<li>run <code>customiser.py</code> to build changes. (for linux run with sudo)</li>
|
||||
</ol>
|
||||
<p>done: run notion and enjoy.</p>
|
||||
<p><strong>oh no, now my app won't open!</strong></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="faq">
|
||||
<h2>
|
||||
<a href="#faq">faq</a>
|
||||
</h2>
|
||||
<p><strong>now the notion app won't open :(</strong></p>
|
||||
<ol>
|
||||
<li>kill any notion tasks in the task manager (<code>ctrl+shift+esc</code>).</li>
|
||||
<li>run <code>cleaner.py</code>.</li>
|
||||
<li>reboot.</li>
|
||||
<li>follow instructions above (ensuring notion <em>isn't</em> running! again, check task manager).</li>
|
||||
</ol>
|
||||
<p><strong>i'm updating from an old version of the enhancer?</strong></p>
|
||||
<p>you must first run <code>cleaner.py</code> before running <code>customiser.py</code>.</p>
|
||||
<p><strong>i tried opening the python file but it just closed instantly and nothing happened?</strong></p>
|
||||
<p>python scripts must be run from the wsl terminal or windows command prompt via e.g. <code>python customiser.py</code>.</p>
|
||||
<p><strong>now that i've run the script, can i delete this folder?</strong></p>
|
||||
<p>python scripts must be run from the terminal or command prompt via e.g. <code>python customiser.py</code>.</p>
|
||||
<p><strong>now that I've run the script, can I delete the enhancer folder?</strong></p>
|
||||
<p>no! user style files <code>resources/user.css</code> and <code>resources/theme.css</code> are fetched from here each time you open notion.
|
||||
additionally, if you ever need to change or reset your notion build, the <code>customiser.py</code> and <code>cleaner.py</code> files will be useful.</p>
|
||||
<p>unless you're sure you know what you're doing (if you have to ask, you probably don't) then do not delete anything.</p>
|
||||
<p><strong>something isn't working, and the suggestions here haven't fixed it...</strong></p>
|
||||
<p>this is probably a bug. please submit a
|
||||
<a href="https://github.com/dragonwocky/notion-enhancer/issues/new?assignees=&labels=bug&template=bug-report.md&title=#" title="">bug report</a>.</p>
|
||||
<p><strong>I have a new feature idea for the enhancer!</strong></p>
|
||||
<p>experienced problems with the notion app, or just want to add something a bit more to it? please submit a
|
||||
<a href="https://github.com/dragonwocky/notion-enhancer/issues/new?assignees=&labels=enhancement&template=feature-request.md&title=#" title="">feature request</a>.</p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="features">
|
||||
@ -72,9 +88,9 @@ replacing <code>element.innerHTML = '⨉';</code> with <code>element.inn
|
||||
<p>i mean, yeah. get rid of those ugly default scrollbars and use nice inconspicuous
|
||||
ones that actually look as if they're part of notion.</p>
|
||||
<p>to add these to the web version, copy lines 44 - 75 from <code>user.css</code> into your css customiser.</p>
|
||||
<p><img src="screenshots/default-before.jpg" alt="">
|
||||
<p><img loading="lazy" src="screenshots/app-unenhanced.jpg" alt="" title="">
|
||||
<em>image: before enhancement</em></p>
|
||||
<p><img src="screenshots/default-after.jpg" alt="">
|
||||
<p><img loading="lazy" src="screenshots/app-enhanced.jpg" alt="" title="">
|
||||
<em>image: after default enhancement</em></p>
|
||||
|
||||
</section>
|
||||
@ -87,7 +103,7 @@ ones that actually look as if they're part of notion.</p>
|
||||
you can now reload a window with <code>F5</code>.</li>
|
||||
<li><strong>toggle all notion windows to/from the tray</strong>: <code>CmdOrCtrl+Shift+A</code> by default.</li>
|
||||
</ul>
|
||||
<p>to set your own toggle hotkey, open <code>customiser.py</code> and change line 16 (<code>hotkey = 'CmdOrCtrl+Shift+A'</code>)
|
||||
<p>to set your own toggle hotkey, open <code>customiser.py</code> and change line 19 (<code>hotkey = 'CmdOrCtrl+Shift+A'</code>)
|
||||
to your preference. you will need to run or re-run <code>customiser.py</code> afterwards.</p>
|
||||
|
||||
</section>
|
||||
@ -96,7 +112,6 @@ to your preference. you will need to run or re-run <code>customiser.py</code> af
|
||||
<a href="#tray">tray</a>
|
||||
</h3>
|
||||
<p>single-click to toggle app visibility. right click to open menu.</p>
|
||||
<p>settings will be saved in <code>%localappdata%/Programs/Notion/resources/app/user-preferences.json</code></p>
|
||||
<ul>
|
||||
<li><strong>run on startup</strong>: run notion on boot/startup. (default: true)</li>
|
||||
<li><strong>hide on open</strong>: hide the launch of notion to the tray. (default: false)</li>
|
||||
@ -104,9 +119,9 @@ to your preference. you will need to run or re-run <code>customiser.py</code> af
|
||||
<li><strong>close to tray</strong>: close window to tray rather than closing outright
|
||||
on click of <code>⨉</code>. does not apply if multiple notion windows are open. (default: false)</li>
|
||||
<li><strong>load theme.css</strong>: loads the custom colour theme file.
|
||||
see <a href="STYLING.md#colour-theming">colour theming</a> for more information. (default: false)</li>
|
||||
see <a href="styling.html#colour-theming" title="">colour theming</a> for more information. (default: false)</li>
|
||||
</ul>
|
||||
<p><img src="screenshots/tray.jpg" alt="">
|
||||
<p><img loading="lazy" src="screenshots/app-tray.jpg" alt="" title="">
|
||||
<em>image: open application tray</em></p>
|
||||
|
||||
</section>
|
||||
@ -115,25 +130,19 @@ see <a href="STYLING.md#colour-theming">colour theming</a> for more information.
|
||||
<a href="#styling">styling</a>
|
||||
</h2>
|
||||
<p>custom appearances can be applied to the app via the <code>resources/user.css</code> and <code>resources/theme.css</code> files. for more information,
|
||||
and a list of various optional styling changes, see <a href="/styling.html">the page on styling</a>.</p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="this-is-a-fork">
|
||||
<h2>
|
||||
<a href="#this-is-a-fork">this is a fork</a>
|
||||
</h2>
|
||||
<p>credit where credit is due, this was originally made by Uzver (github: <a href="https://github.com/TarasokUA">@TarasokUA</a>,
|
||||
telegram: <a href="https://t.me/UserFromUkraine">UserFromUkraine</a>, discord: Uzver#8760).</p>
|
||||
<p>he has approved my go-ahead with this fork, as he himself no longer wishes to continue development on the project.</p>
|
||||
and a list of various optional styling changes, see <a href="styling.html#" title="">the page on styling</a>.</p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="other-details">
|
||||
<h2>
|
||||
<a href="#other-details">other details</a>
|
||||
</h2>
|
||||
<p>the notion logo belongs entirely to the notion team, and was sourced from their
|
||||
<a href="https://www.notion.so/Media-Kit-205535b1d9c4440497a3d7a2ac096286">media kit</a>.</p>
|
||||
<p>if you have any questions, check <a href="https://dragonwocky.me/">my website</a> for contact details.</p>
|
||||
<p>credit where credit is due, this was originally made by Uzver (github: <a href="https://github.com/TarasokUA#" title="">@TarasokUA</a>,
|
||||
telegram: <a href="https://t.me/UserFromUkraine#" title="">UserFromUkraine</a>, discord: Uzver#8760).
|
||||
he has approved my go-ahead with this fork, as he himself no longer wishes to continue development on the project.</p>
|
||||
<p>the notion logo belongs entirely to the notion team, and was sourced from their
|
||||
<a href="https://www.notion.so/Media-Kit-205535b1d9c4440497a3d7a2ac096286#" title="">media kit</a>.</p>
|
||||
<p>if you have any questions, check <a href="https://dragonwocky.me/#" title="">my website</a> for contact details.</p>
|
||||
|
||||
</section></div><footer class="footer"><hr><p><a href="https://github.com/dragonwocky/notion-enhancer/blob/master/README.md">Edit on GitHub</a> // © 2020 dragonwocky & Uzver, under the <a href="https://choosealicense.com/licenses/mit/">MIT license</a>.</p>
|
||||
</footer><nav><a class="next" href="styling.html">ᐅ</a></nav></article></div></body></html>
|
||||
BIN
docs/screenshots/app-default.jpg
Normal file
BIN
docs/screenshots/app-default.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 225 KiB |
|
Before Width: | Height: | Size: 230 KiB After Width: | Height: | Size: 230 KiB |
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 32 KiB |
|
Before Width: | Height: | Size: 243 KiB After Width: | Height: | Size: 243 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 80 KiB |
BIN
docs/screenshots/board-default.jpg
Normal file
BIN
docs/screenshots/board-default.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 82 KiB |
BIN
docs/screenshots/board-hideaddgroup.jpg
Normal file
BIN
docs/screenshots/board-hideaddgroup.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 80 KiB |
BIN
docs/screenshots/board-hideaddnew.jpg
Normal file
BIN
docs/screenshots/board-hideaddnew.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 79 KiB |
BIN
docs/screenshots/board-hidehidden.jpg
Normal file
BIN
docs/screenshots/board-hidehidden.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 76 KiB |
BIN
docs/screenshots/board-shrinkpadding.jpg
Normal file
BIN
docs/screenshots/board-shrinkpadding.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 80 KiB |
|
Before Width: | Height: | Size: 376 KiB After Width: | Height: | Size: 376 KiB |
|
Before Width: | Height: | Size: 269 KiB After Width: | Height: | Size: 269 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 395 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 390 KiB |
|
Before Width: | Height: | Size: 76 KiB After Width: | Height: | Size: 76 KiB |
|
Before Width: | Height: | Size: 61 KiB After Width: | Height: | Size: 61 KiB |
BIN
docs/screenshots/fonts-custom.jpg
Normal file
BIN
docs/screenshots/fonts-custom.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 243 KiB |
|
Before Width: | Height: | Size: 243 KiB After Width: | Height: | Size: 243 KiB |
|
Before Width: | Height: | Size: 271 KiB After Width: | Height: | Size: 271 KiB |
|
Before Width: | Height: | Size: 267 KiB After Width: | Height: | Size: 267 KiB |
BIN
docs/screenshots/table-centredheaders.jpg
Normal file
BIN
docs/screenshots/table-centredheaders.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 110 KiB |
BIN
docs/screenshots/table-columnunder100px.jpg
Normal file
BIN
docs/screenshots/table-columnunder100px.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 118 KiB |
|
Before Width: | Height: | Size: 98 KiB After Width: | Height: | Size: 98 KiB |
|
Before Width: | Height: | Size: 100 KiB After Width: | Height: | Size: 100 KiB |
BIN
docs/screenshots/table-hidecolumnicons.jpg
Normal file
BIN
docs/screenshots/table-hidecolumnicons.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 106 KiB |
BIN
docs/screenshots/table-shrinkpadding.jpg
Normal file
BIN
docs/screenshots/table-shrinkpadding.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 110 KiB |
BIN
docs/screenshots/table-smallercolumnicons.jpg
Normal file
BIN
docs/screenshots/table-smallercolumnicons.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 109 KiB |
|
Before Width: | Height: | Size: 234 KiB After Width: | Height: | Size: 234 KiB |
@ -1,4 +1,4 @@
|
||||
<!DOCTYPE html><!-- Documentative--><!-- (c) 2020 dragonwocky <thedragonring.bod@gmail.com>--><!-- (https://dragonwocky.me/) under the MIT license--><html prefix="og: http://ogp.me/ns#"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>styling | notion enhancer</title><link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Code+Pro|Nunito+Sans"><link rel="stylesheet" href="docs.css"><script src="docs.js"></script><link rel="icon" href="web-logo.png" media="(prefers-color-scheme: dark)"><link rel="icon" href="web-logo.png"><meta name="title" content="styling | notion enhancer"><meta name="description" content="an enhancer/customiser for the all-in-one productivity workspace notion.so"><meta name="theme-color" content="rgb(75, 133, 209)"><meta property="og:type" content="article"><meta property="og:url" content="https://dragonwocky.me/notion-enhancer/styling.html"><meta property="og:title" content="styling"><meta property="og:site_name" content="notion enhancer"><meta property="og:description" content="an enhancer/customiser for the all-in-one productivity workspace notion.so"><meta property="og:image" content="https://dragonwocky.me/notion-enhancer/web-logo.png"><meta property="twitter:card" content="summary"></head><body><aside class="menu"><div><div class="title"><h1>notion enhancer</h1><picture class="icon"><source srcset="web-logo.png" media="(prefers-color-scheme: dark)"><img src="web-logo.png"></picture></div></div><ul class="nav"><li class="entry"><a href="index.html">notion enhancer</a></li><li class="entry"><a href="#styling">styling</a><ul><li class="level-3"><a href="#colour-theming">colour theming</a></li><li class="level-3"><a href="#hide-discussions-comment-threads-at-the-top-of-each-page">hide discussions (comment threads at the top of each page)</a></li><li class="level-3"><a href="#custom-fonts">custom fonts</a></li><li class="level-3"><a href="#font-resizing">font resizing</a></li><li class="level-3"><a href="#wider-page-preview">wider page preview</a></li><li class="level-3"><a href="#thinner-cover-image">thinner cover image</a></li><li class="level-3"><a href="#table-columns-below-100px">table columns below 100px</a></li><li class="level-3"><a href="#hide--new-table-row">hide '+ new' table row</a></li><li class="level-3"><a href="#hide-calculations-table-row">hide calculations table row</a></li><li class="level-3"><a href="#hide--new-board-row">hide '+ new' board row</a></li><li class="level-3"><a href="#hide-board-view-hidden-columns">hide board view hidden columns</a></li><li class="level-3"><a href="#hide-board-view-add-a-group">hide board view 'add a group'</a></li><li class="level-3"><a href="#centre-align-table-column-headers">centre-align table column headers</a></li><li class="level-3"><a href="#smaller-table-column-header-icons">smaller table column header icons</a></li><li class="level-3"><a href="#remove-icons-from-table-column-headers">remove icons from table column headers</a></li><li class="level-3"><a href="#removingdecreasing-side-padding-for-tables">removing/decreasing side padding for tables</a></li><li class="level-3"><a href="#removingdecreasing-side-padding-for-boards">removing/decreasing side padding for boards</a></li></ul></li><li class="entry"><p>resources</p></li><li class="entry"><a href="changelog.html">changelog</a></li><li class="entry"><a href="https://github.com/dragonwocky/notion-enhancer/blob/master/LICENSE">license</a></li><li class="entry"><a href="https://github.com/dragonwocky/notion-enhancer/">github</a></li><li class="entry"><a href="https://dragonwocky.me/">me (dragonwocky)</a></li></ul><p class="mark"><a href="https://dragonwocky.me/documentative">docs by documentative</a></p></aside><div class="wrapper"><div class="toggle"><button>☰</button><h1>notion enhancer</h1></div><article class="documentative"><div class="content">
|
||||
<!DOCTYPE html><!-- Documentative--><!-- (c) 2020 dragonwocky <thedragonring.bod@gmail.com>--><!-- (https://dragonwocky.me/) under the MIT license--><html prefix="og: http://ogp.me/ns#"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>styling | notion enhancer</title><link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Code+Pro|Nunito+Sans"><link rel="stylesheet" href="docs.css"><script src="docs.js"></script><link rel="icon" href="web-logo.png" media="(prefers-color-scheme: dark)"><link rel="icon" href="web-logo.png"><meta name="title" content="styling | notion enhancer"><meta name="description" content="an enhancer/customiser for the all-in-one productivity workspace notion.so"><meta name="theme-color" content="rgb(75, 133, 209)"><meta property="og:type" content="article"><meta property="og:url" content="https://dragonwocky.me/notion-enhancer/styling.html"><meta property="og:title" content="styling"><meta property="og:site_name" content="notion enhancer"><meta property="og:description" content="an enhancer/customiser for the all-in-one productivity workspace notion.so"><meta property="og:image" content="https://dragonwocky.me/notion-enhancer/web-logo.png"><meta property="twitter:card" content="summary"></head><body><aside class="menu"><div><div class="title"><h1>notion enhancer</h1><picture class="icon"><source srcset="web-logo.png" media="(prefers-color-scheme: dark)"><img src="web-logo.png"></picture></div></div><ul class="nav"><li class="entry"><a href="index.html">notion enhancer</a></li><li class="entry"><a href="#styling">styling</a><ul><li class="level-2"><a href="#generalapp-wide">general/app-wide</a></li><li class="level-3"><a href="#colour-theming">colour theming</a></li><li class="level-3"><a href="#hide-discussions-comment-threads-at-the-top-of-each-page">hide discussions (comment threads at the top of each page)</a></li><li class="level-3"><a href="#custom-fonts">custom fonts</a></li><li class="level-3"><a href="#font-resizing">font resizing</a></li><li class="level-3"><a href="#wider-page-preview">wider page preview</a></li><li class="level-3"><a href="#thinner-cover-image">thinner cover image</a></li><li class="level-2"><a href="#tables">tables</a></li><li class="level-3"><a href="#table-columns-below-100px">table columns below 100px</a></li><li class="level-3"><a href="#hide--new-table-row">hide '+ new' table row</a></li><li class="level-3"><a href="#hide-calculations-table-row">hide calculations table row</a></li><li class="level-3"><a href="#centre-align-table-column-headers">centre-align table column headers</a></li><li class="level-3"><a href="#smaller-table-column-header-icons">smaller table column header icons</a></li><li class="level-3"><a href="#remove-icons-from-table-column-headers">remove icons from table column headers</a></li><li class="level-3"><a href="#removingdecreasing-side-padding-for-tables">removing/decreasing side padding for tables</a></li><li class="level-2"><a href="#boards">boards</a></li><li class="level-3"><a href="#hide--new-board-row">hide '+ new' board row</a></li><li class="level-3"><a href="#hide-board-view-hidden-columns">hide board view hidden columns</a></li><li class="level-3"><a href="#hide-board-view-add-a-group">hide board view 'add a group'</a></li><li class="level-3"><a href="#removingdecreasing-side-padding-for-boards">removing/decreasing side padding for boards</a></li></ul></li><li class="entry"><p>resources</p></li><li class="entry"><a href="changelog.html">changelog</a></li><li class="entry"><a href="https://github.com/dragonwocky/notion-enhancer/blob/master/LICENSE">license</a></li><li class="entry"><a href="https://github.com/dragonwocky/notion-enhancer/">github</a></li><li class="entry"><a href="https://dragonwocky.me/">me (dragonwocky)</a></li></ul><p class="mark"><a href="https://dragonwocky.me/documentative">docs by documentative</a></p></aside><div class="wrapper"><div class="toggle"><button>☰</button><h1>notion enhancer</h1></div><article class="documentative"><div class="content">
|
||||
|
||||
<section class="block" id="styling">
|
||||
<h1>
|
||||
@ -7,14 +7,22 @@
|
||||
<p>to modify the appearance of the notion app, edit the style rules in <code>resources/user.css</code>,
|
||||
use some of the suggested/documented optional styles below, or invent your own.</p>
|
||||
<p>these styles are written in a language called "CSS". if you don't know what this is and are interested,
|
||||
check out some youtube videos or <a href="https://www.codecademy.com/learn/learn-css">try a free short course like the one on codecademy</a>.</p>
|
||||
check out some youtube videos or <a href="https://www.codecademy.com/learn/learn-css#" title="">try a free short course like the one on codecademy</a>.</p>
|
||||
<p>due to the enhancements directly fetching from the local CSS files,
|
||||
changes will be applied instantly on notion reload
|
||||
(no need to re-run <code>customiser.py</code> every time you want to change some styles).</p>
|
||||
<p>these should also work for the web version, if copied into your css customiser.</p>
|
||||
<p>css below will work for every instance of the element, but if you wish to hide only a specific element
|
||||
(e.g. the '+ new' table row) it is recommended that you prepend each selector with
|
||||
<code>[data-block-id='ID']</code> (<a href="https://www.youtube.com/watch?v=6V7eqShm_4w">video tutorial on fetching IDs</a>).</p>
|
||||
<code>[data-block-id='ID']</code>.</p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="generalapp-wide">
|
||||
<h2>
|
||||
<a href="#generalapp-wide">general/app-wide</a>
|
||||
</h2>
|
||||
<p><img loading="lazy" src="screenshots/app-default.jpg" alt="" title="">
|
||||
<em>image: the default post-customisation appearance</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="colour-theming">
|
||||
@ -24,10 +32,10 @@ changes will be applied instantly on notion reload
|
||||
<p>this replaces the default notion dark theme. the provided theme file is my custom dark+ theme:
|
||||
if you have another you wish to share, please contact me. if a few themes are submitted i will
|
||||
set up a distribution method (either including them as optionally-enableabled themes or sharing them on the website).</p>
|
||||
<p>to enable, see the <a href="README.md#tray">tray</a> options.</p>
|
||||
<p>to enable, see the <a href="index.html#tray" title="">tray</a> options.</p>
|
||||
<p>to modify, enter the <code>theme.css</code> file and change the colour values within the <code>:root {}</code> - value names
|
||||
should describe what each colour will affect.</p>
|
||||
<p><img src="screenshots/theme.jpg" alt="">
|
||||
<p><img loading="lazy" src="screenshots/theme-dark+.jpg" alt="" title="">
|
||||
<em>image: the dark+ theme</em></p>
|
||||
|
||||
</section>
|
||||
@ -38,10 +46,10 @@ should describe what each colour will affect.</p>
|
||||
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-page-view-discussion</span> {
|
||||
<span class="hljs-attribute">display</span>: none <span class="hljs-meta">!important</span>;
|
||||
}</code></pre>
|
||||
<p><img src="screenshots/hidediscussion-before.jpg" alt="">
|
||||
<em>image: before</em></p>
|
||||
<p><img src="screenshots/hidediscussion-after.jpg" alt="">
|
||||
<em>image: after</em></p>
|
||||
<p><img loading="lazy" src="screenshots/discussion-default.jpg" alt="" title="">
|
||||
<em>image: before styling</em></p>
|
||||
<p><img loading="lazy" src="screenshots/discussion-hidden.jpg" alt="" title="">
|
||||
<em>image: after styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="custom-fonts">
|
||||
@ -50,7 +58,7 @@ should describe what each colour will affect.</p>
|
||||
</h3>
|
||||
<p><strong>the <code>@import</code> statement must be added to the top of the file (with nothing above it</strong>
|
||||
<strong>except comments or other <code>@import</code> statements)</strong></p>
|
||||
<p>to change the fonts, change the font-family property. there are
|
||||
<p>to change the fonts, put the relevant URL in the <code>@import</code> statement and then change the <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-family#" title="">font-family</a> property.
|
||||
plenty of other fonts that can be found on google fonts or that may be on your system already.</p>
|
||||
<pre><code class="lang-css"><span class="hljs-keyword">@import</span> url(<span class="hljs-string">'https://fonts.googleapis.com/css2?family=Fira+Code&family=Oxygen&family=Roboto+Slab:wght@300&display=swap'</span>);
|
||||
<span class="hljs-selector-class">.notion-app-inner</span> {
|
||||
@ -62,10 +70,8 @@ plenty of other fonts that can be found on google fonts or that may be on your s
|
||||
<span class="hljs-selector-attr">[style*=<span class="hljs-string">', serif;'</span>]</span> {
|
||||
<span class="hljs-attribute">font-family</span>: <span class="hljs-string">'Roboto Slab'</span>, serif <span class="hljs-meta">!important</span>;
|
||||
}</code></pre>
|
||||
<p><img src="screenshots/customfonts-before.jpg" alt="">
|
||||
<em>image: before</em></p>
|
||||
<p><img src="screenshots/customfonts-after.jpg" alt="">
|
||||
<em>image: after</em></p>
|
||||
<p><img loading="lazy" src="screenshots/fonts-custom.jpg" alt="" title="">
|
||||
<em>image: after styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="font-resizing">
|
||||
@ -99,8 +105,8 @@ it is suggested to instead use <code>ctrl+</code> or <code>ctrl-</code> to scale
|
||||
<span class="hljs-selector-attr">[style*=<span class="hljs-string">'font-size: 1.25em'</span>]</span> {
|
||||
<span class="hljs-attribute">font-size</span>: <span class="hljs-built_in">calc</span>(var(--font-scale) * <span class="hljs-number">1.25em</span>) <span class="hljs-meta">!important</span>;
|
||||
}</code></pre>
|
||||
<p><img src="screenshots/fontresizing.jpg" alt="">
|
||||
<em>image: after</em></p>
|
||||
<p><img loading="lazy" src="screenshots/fonts-resized.jpg" alt="" title="">
|
||||
<em>image: after styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="wider-page-preview">
|
||||
@ -110,10 +116,10 @@ it is suggested to instead use <code>ctrl+</code> or <code>ctrl-</code> to scale
|
||||
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-peek-renderer</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-child(2)</span> {
|
||||
<span class="hljs-attribute">max-width</span>: <span class="hljs-number">85vw</span> <span class="hljs-meta">!important</span>;
|
||||
}</code></pre>
|
||||
<p><img src="screenshots/widerpreview-before.jpg" alt="">
|
||||
<em>image: before</em></p>
|
||||
<p><img src="screenshots/widerpreview-after.jpg" alt="">
|
||||
<em>image: after</em></p>
|
||||
<p><img loading="lazy" src="screenshots/preview-default.jpg" alt="" title="">
|
||||
<em>image: before styling</em></p>
|
||||
<p><img loading="lazy" src="screenshots/preview-wider.jpg" alt="" title="">
|
||||
<em>image: after styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="thinner-cover-image">
|
||||
@ -127,35 +133,45 @@ it is suggested to instead use <code>ctrl+</code> or <code>ctrl-</code> to scale
|
||||
<span class="hljs-selector-tag">img</span> {
|
||||
<span class="hljs-attribute">height</span>: <span class="hljs-number">12vh</span> <span class="hljs-meta">!important</span>;
|
||||
}</code></pre>
|
||||
<p><img src="screenshots/thinnercover-before.jpg" alt="">
|
||||
<em>image: before</em></p>
|
||||
<p><img src="screenshots/thinnercover-after.jpg" alt="">
|
||||
<em>image: after</em></p>
|
||||
<p><img loading="lazy" src="screenshots/cover-default.jpg" alt="" title="">
|
||||
<em>image: before styling</em></p>
|
||||
<p><img loading="lazy" src="screenshots/cover-thinner.jpg" alt="" title="">
|
||||
<em>image: after styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="tables">
|
||||
<h2>
|
||||
<a href="#tables">tables</a>
|
||||
</h2>
|
||||
<p><img loading="lazy" src="screenshots/table-before.jpg" alt="" title="">
|
||||
<em>image: before styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="table-columns-below-100px">
|
||||
<h3>
|
||||
<a href="#table-columns-below-100px">table columns below 100px</a>
|
||||
</h3>
|
||||
<p><strong>not recommended!</strong> this is unreliable and will cause bugs.
|
||||
coincidentally, this is also what the youtube video linked above shows how to do.
|
||||
as it is a per-table-column style, unlike all others here, it must be prepended with the block ID.</p>
|
||||
<pre><code class="lang-css"><span class="hljs-selector-attr">[data-block-id^=<span class="hljs-string">'ID'</span>]</span>
|
||||
<p><strong>not recommended!</strong> this may cause buggy viewing.
|
||||
as it is a per-table-column style, unlike all others here, it must be prepended with the block ID and repeated for each column.</p>
|
||||
<p>to see how to do this, watch <a href="https://www.youtube.com/watch?v=6V7eqShm_4w#" title="">this video</a>.</p>
|
||||
<pre><code class="lang-css"><span class="hljs-selector-attr">[data-block-id^=<span class="hljs-string">'tableID'</span>]</span>
|
||||
> <span class="hljs-selector-attr">[style^=<span class="hljs-string">'display: flex; position: absolute; background: rgb(47, 52, 55); z-index: 82; height: 33px; color: rgba(255, 255, 255, 0.6);'</span>]</span>
|
||||
> <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-child(1)</span>
|
||||
> <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-child(10)</span>
|
||||
> <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-child(COL_NUMBER)</span>
|
||||
> <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-child(1)</span>,
|
||||
<span class="hljs-selector-attr">[data-block-id^=<span class="hljs-string">'ID'</span>]</span>
|
||||
<span class="hljs-selector-attr">[data-block-id^=<span class="hljs-string">'tableID'</span>]</span>
|
||||
> <span class="hljs-selector-attr">[style^=<span class="hljs-string">'position: relative; min-width: calc(100% - 192px);'</span>]</span>
|
||||
> <span class="hljs-selector-attr">[data-block-id]</span>
|
||||
> <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-child(10)</span>,
|
||||
<span class="hljs-selector-attr">[data-block-id^=<span class="hljs-string">'ID'</span>]</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-child(5)</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-child(10)</span> {
|
||||
<span class="hljs-attribute">width</span>: <span class="hljs-number">45px</span> <span class="hljs-meta">!important</span>;
|
||||
> <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-child(COL_NUMBER)</span>,
|
||||
<span class="hljs-selector-attr">[data-block-id^=<span class="hljs-string">'tableID'</span>]</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-child(5)</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-child(COL_NUMBER)</span> {
|
||||
<span class="hljs-attribute">width</span>: <span class="hljs-number">32px</span> <span class="hljs-meta">!important</span>;
|
||||
}
|
||||
<span class="hljs-selector-attr">[data-block-id^=<span class="hljs-string">'ID'</span>]</span>
|
||||
<span class="hljs-selector-attr">[data-block-id^=<span class="hljs-string">'tableID'</span>]</span>
|
||||
<span class="hljs-selector-attr">[style^=<span class="hljs-string">'position: absolute; top: 0px; left: 0px; pointer-events: none;'</span>]</span><span class="hljs-selector-pseudo">:not(.notion-presence-container)</span> {
|
||||
<span class="hljs-attribute">display</span>: none;
|
||||
}</code></pre>
|
||||
<p><img loading="lazy" src="screenshots/table-columnunder100px.jpg" alt="" title="">
|
||||
<em>image: after styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="hide--new-table-row">
|
||||
@ -165,10 +181,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
|
||||
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-table-view-add-row</span> {
|
||||
<span class="hljs-attribute">display</span>: none <span class="hljs-meta">!important</span>;
|
||||
}</code></pre>
|
||||
<p><img src="screenshots/table-before.jpg" alt="">
|
||||
<em>image: before</em></p>
|
||||
<p><img src="screenshots/hideaddrow-after.jpg" alt="">
|
||||
<em>image: after</em></p>
|
||||
<p><img loading="lazy" src="screenshots/table-hideaddrow.jpg" alt="" title="">
|
||||
<em>image: after styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="hide-calculations-table-row">
|
||||
@ -178,40 +192,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
|
||||
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-table-view-add-row</span> + <span class="hljs-selector-tag">div</span> {
|
||||
<span class="hljs-attribute">display</span>: none <span class="hljs-meta">!important</span>;
|
||||
}</code></pre>
|
||||
<p><img src="screenshots/table-before.jpg" alt="">
|
||||
<em>image: before</em></p>
|
||||
<p><img src="screenshots/hidecalculationsrow-after.jpg" alt="">
|
||||
<em>image: after</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="hide--new-board-row">
|
||||
<h3>
|
||||
<a href="#hide--new-board-row">hide '+ new' board row</a>
|
||||
</h3>
|
||||
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-board-group</span>
|
||||
<span class="hljs-selector-attr">[style=<span class="hljs-string">'user-select: none; transition: background 120ms ease-in 0s; cursor: pointer; display: inline-flex; align-items: center; flex-shrink: 0; white-space: nowrap; height: 32px; border-radius: 3px; font-size: 14px; line-height: 1.2; min-width: 0px; padding-left: 6px; padding-right: 8px; color: rgba(255, 255, 255, 0.4); width: 100%;'</span>]</span> {
|
||||
<span class="hljs-attribute">display</span>: none <span class="hljs-meta">!important</span>;
|
||||
}</code></pre>
|
||||
|
||||
</section>
|
||||
<section class="block" id="hide-board-view-hidden-columns">
|
||||
<h3>
|
||||
<a href="#hide-board-view-hidden-columns">hide board view hidden columns</a>
|
||||
</h3>
|
||||
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-board-view</span> > <span class="hljs-selector-attr">[data-block-id]</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-last-child(2)</span>,
|
||||
<span class="hljs-selector-class">.notion-board-view</span> > <span class="hljs-selector-attr">[data-block-id]</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:first-child</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-last-child(2)</span> {
|
||||
<span class="hljs-attribute">display</span>: none <span class="hljs-meta">!important</span>;
|
||||
}</code></pre>
|
||||
|
||||
</section>
|
||||
<section class="block" id="hide-board-view-add-a-group">
|
||||
<h3>
|
||||
<a href="#hide-board-view-add-a-group">hide board view 'add a group'</a>
|
||||
</h3>
|
||||
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-board-view</span> > <span class="hljs-selector-attr">[data-block-id]</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:last-child</span>,
|
||||
<span class="hljs-selector-class">.notion-board-view</span> > <span class="hljs-selector-attr">[data-block-id]</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:first-child</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:last-child</span> {
|
||||
<span class="hljs-attribute">display</span>: none <span class="hljs-meta">!important</span>;
|
||||
}</code></pre>
|
||||
<p><img loading="lazy" src="screenshots/table-hidecalculationsrow.jpg" alt="" title="">
|
||||
<em>image: after styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="centre-align-table-column-headers">
|
||||
@ -221,6 +203,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
|
||||
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-table-view-header-cell</span> > <span class="hljs-selector-tag">div</span> > <span class="hljs-selector-tag">div</span> {
|
||||
<span class="hljs-attribute">margin</span>: <span class="hljs-number">0px</span> auto;
|
||||
}</code></pre>
|
||||
<p><img loading="lazy" src="screenshots/table-centredheaders.jpg" alt="" title="">
|
||||
<em>image: after styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="smaller-table-column-header-icons">
|
||||
@ -234,6 +218,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
|
||||
<span class="hljs-attribute">width</span>: <span class="hljs-number">10px</span> <span class="hljs-meta">!important</span>;
|
||||
<span class="hljs-attribute">margin-right</span>: -<span class="hljs-number">4px</span>;
|
||||
}</code></pre>
|
||||
<p><img loading="lazy" src="screenshots/table-smallercolumnicons.jpg" alt="" title="">
|
||||
<em>image: after styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="remove-icons-from-table-column-headers">
|
||||
@ -243,6 +229,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
|
||||
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-table-view-header-cell</span> <span class="hljs-selector-attr">[style^=<span class="hljs-string">'margin-right: 6px;'</span>]</span> {
|
||||
<span class="hljs-attribute">display</span>: none <span class="hljs-meta">!important</span>;
|
||||
}</code></pre>
|
||||
<p><img loading="lazy" src="screenshots/table-hidecolumnicons.jpg" alt="" title="">
|
||||
<em>image: after styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="removingdecreasing-side-padding-for-tables">
|
||||
@ -262,6 +250,52 @@ as it is a per-table-column style, unlike all others here, it must be prepended
|
||||
<span class="hljs-attribute">margin-left</span>: <span class="hljs-number">10px</span>;
|
||||
<span class="hljs-attribute">margin-right</span>: <span class="hljs-number">10px</span>;
|
||||
}</code></pre>
|
||||
<p><img loading="lazy" src="screenshots/table-shrinkpadding.jpg" alt="" title="">
|
||||
<em>image: after styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="boards">
|
||||
<h2>
|
||||
<a href="#boards">boards</a>
|
||||
</h2>
|
||||
<p><img loading="lazy" src="screenshots/board-default.jpg" alt="" title="">
|
||||
<em>image: before styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="hide--new-board-row">
|
||||
<h3>
|
||||
<a href="#hide--new-board-row">hide '+ new' board row</a>
|
||||
</h3>
|
||||
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-board-group</span>
|
||||
<span class="hljs-selector-attr">[style=<span class="hljs-string">'user-select: none; transition: background 120ms ease-in 0s; cursor: pointer; display: inline-flex; align-items: center; flex-shrink: 0; white-space: nowrap; height: 32px; border-radius: 3px; font-size: 14px; line-height: 1.2; min-width: 0px; padding-left: 6px; padding-right: 8px; color: rgba(255, 255, 255, 0.4); width: 100%;'</span>]</span> {
|
||||
<span class="hljs-attribute">display</span>: none <span class="hljs-meta">!important</span>;
|
||||
}</code></pre>
|
||||
<p><img loading="lazy" src="screenshots/board-hideaddnew.jpg" alt="" title="">
|
||||
<em>image: after styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="hide-board-view-hidden-columns">
|
||||
<h3>
|
||||
<a href="#hide-board-view-hidden-columns">hide board view hidden columns</a>
|
||||
</h3>
|
||||
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-board-view</span> > <span class="hljs-selector-attr">[data-block-id]</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-last-child(2)</span>,
|
||||
<span class="hljs-selector-class">.notion-board-view</span> > <span class="hljs-selector-attr">[data-block-id]</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:first-child</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-last-child(2)</span> {
|
||||
<span class="hljs-attribute">display</span>: none <span class="hljs-meta">!important</span>;
|
||||
}</code></pre>
|
||||
<p><img loading="lazy" src="screenshots/board-hidehidden.jpg" alt="" title="">
|
||||
<em>image: after styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="hide-board-view-add-a-group">
|
||||
<h3>
|
||||
<a href="#hide-board-view-add-a-group">hide board view 'add a group'</a>
|
||||
</h3>
|
||||
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-board-view</span> > <span class="hljs-selector-attr">[data-block-id]</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:last-child</span>,
|
||||
<span class="hljs-selector-class">.notion-board-view</span> > <span class="hljs-selector-attr">[data-block-id]</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:first-child</span> > <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:last-child</span> {
|
||||
<span class="hljs-attribute">display</span>: none <span class="hljs-meta">!important</span>;
|
||||
}</code></pre>
|
||||
<p><img loading="lazy" src="screenshots/board-hideaddgroup.jpg" alt="" title="">
|
||||
<em>image: after styling</em></p>
|
||||
|
||||
</section>
|
||||
<section class="block" id="removingdecreasing-side-padding-for-boards">
|
||||
@ -272,6 +306,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
|
||||
<span class="hljs-attribute">padding-left</span>: <span class="hljs-number">10px</span> <span class="hljs-meta">!important</span>;
|
||||
<span class="hljs-attribute">padding-right</span>: <span class="hljs-number">10px</span> <span class="hljs-meta">!important</span>;
|
||||
}</code></pre>
|
||||
<p><img loading="lazy" src="screenshots/board-shrinkpadding.jpg" alt="" title="">
|
||||
<em>image: after styling</em></p>
|
||||
|
||||
</section></div><footer class="footer"><hr><p><a href="https://github.com/dragonwocky/notion-enhancer/blob/master/STYLING.md">Edit on GitHub</a> // © 2020 dragonwocky & Uzver, under the <a href="https://choosealicense.com/licenses/mit/">MIT license</a>.</p>
|
||||
</footer><nav><a class="prev" href="index.html">ᐊ</a><a class="next" href="changelog.html">ᐅ</a></nav></article></div></body></html>
|
||||
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 15 KiB |
BIN
screenshots/app-default.jpg
Normal file
BIN
screenshots/app-default.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 225 KiB |
|
Before Width: | Height: | Size: 230 KiB After Width: | Height: | Size: 230 KiB |
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 32 KiB |
|
Before Width: | Height: | Size: 243 KiB After Width: | Height: | Size: 243 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 80 KiB |
BIN
screenshots/board-default.jpg
Normal file
BIN
screenshots/board-default.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 82 KiB |
BIN
screenshots/board-hideaddgroup.jpg
Normal file
BIN
screenshots/board-hideaddgroup.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 80 KiB |
BIN
screenshots/board-hideaddnew.jpg
Normal file
BIN
screenshots/board-hideaddnew.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 79 KiB |
BIN
screenshots/board-hidehidden.jpg
Normal file
BIN
screenshots/board-hidehidden.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 76 KiB |
BIN
screenshots/board-shrinkpadding.jpg
Normal file
BIN
screenshots/board-shrinkpadding.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 80 KiB |
|
Before Width: | Height: | Size: 376 KiB After Width: | Height: | Size: 376 KiB |
|
Before Width: | Height: | Size: 269 KiB After Width: | Height: | Size: 269 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 395 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 390 KiB |
|
Before Width: | Height: | Size: 76 KiB After Width: | Height: | Size: 76 KiB |
|
Before Width: | Height: | Size: 61 KiB After Width: | Height: | Size: 61 KiB |
BIN
screenshots/fonts-custom.jpg
Normal file
BIN
screenshots/fonts-custom.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 243 KiB |
|
Before Width: | Height: | Size: 243 KiB After Width: | Height: | Size: 243 KiB |
|
Before Width: | Height: | Size: 271 KiB After Width: | Height: | Size: 271 KiB |
|
Before Width: | Height: | Size: 267 KiB After Width: | Height: | Size: 267 KiB |
BIN
screenshots/table-centredheaders.jpg
Normal file
BIN
screenshots/table-centredheaders.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 110 KiB |
BIN
screenshots/table-columnunder100px.jpg
Normal file
BIN
screenshots/table-columnunder100px.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 118 KiB |
|
Before Width: | Height: | Size: 98 KiB After Width: | Height: | Size: 98 KiB |
|
Before Width: | Height: | Size: 100 KiB After Width: | Height: | Size: 100 KiB |
BIN
screenshots/table-hidecolumnicons.jpg
Normal file
BIN
screenshots/table-hidecolumnicons.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 106 KiB |
BIN
screenshots/table-shrinkpadding.jpg
Normal file
BIN
screenshots/table-shrinkpadding.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 110 KiB |
BIN
screenshots/table-smallercolumnicons.jpg
Normal file
BIN
screenshots/table-smallercolumnicons.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 109 KiB |
|
Before Width: | Height: | Size: 234 KiB After Width: | Height: | Size: 234 KiB |
Loading…
Reference in New Issue
Block a user