mirror of
https://github.com/notion-enhancer/notion-enhancer.git
synced 2025-04-05 13:19:03 +00:00
139 lines
11 KiB
HTML
139 lines
11 KiB
HTML
<!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">
|
|
|
|
<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>
|
|
|
|
</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>
|
|
<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>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>
|
|
</ol>
|
|
<p>done: run notion and enjoy.</p>
|
|
<p><strong>oh no, now my 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>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>
|
|
|
|
</section>
|
|
<section class="block" id="features">
|
|
<h2>
|
|
<a href="#features">features</a>
|
|
</h2>
|
|
|
|
</section>
|
|
<section class="block" id="titlebar">
|
|
<h3>
|
|
<a href="#titlebar">titlebar</a>
|
|
</h3>
|
|
<p>default windows titlebar/frame has been replaced by one more fitting to the theme of the app.</p>
|
|
<p>this includes the addition of an extra button, "always on top"
|
|
symbolised with an arrow (4th from the right). when toggled to point up,
|
|
notion will remain the top visible window even if not focused.</p>
|
|
<p>to customise which characters are used for these buttons, open in the <code>resources/preload.js</code> file,
|
|
find the relevant button (read the comments) and replace its icon with your chosen unicode character (e.g.
|
|
replacing <code>element.innerHTML = '⨉';</code> with <code>element.innerHTML = '🙄';</code>).</p>
|
|
|
|
</section>
|
|
<section class="block" id="nicer-scrollbars">
|
|
<h3>
|
|
<a href="#nicer-scrollbars">nicer scrollbars</a>
|
|
</h3>
|
|
<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="">
|
|
<em>image: before enhancement</em></p>
|
|
<p><img src="screenshots/default-after.jpg" alt="">
|
|
<em>image: after default enhancement</em></p>
|
|
|
|
</section>
|
|
<section class="block" id="hotkeys">
|
|
<h3>
|
|
<a href="#hotkeys">hotkeys</a>
|
|
</h3>
|
|
<ul>
|
|
<li><strong>reload window</strong>: in addition to the built-in <code>CmdOrCtrl+R</code> reload,
|
|
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>)
|
|
to your preference. you will need to run or re-run <code>customiser.py</code> afterwards.</p>
|
|
|
|
</section>
|
|
<section class="block" id="tray">
|
|
<h3>
|
|
<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>
|
|
<li><strong>open maximised</strong>: maximise the app on open. (default: false)</li>
|
|
<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>
|
|
</ul>
|
|
<p><img src="screenshots/tray.jpg" alt="">
|
|
<em>image: open application tray</em></p>
|
|
|
|
</section>
|
|
<section class="block" id="styling">
|
|
<h2>
|
|
<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>
|
|
|
|
</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>
|
|
|
|
</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> |