docs: update documentative + link to media kit

This commit is contained in:
dragonwocky 2020-03-31 20:04:19 +11:00
parent 1f6bf7bf23
commit 8ab53a19a5
Signed by: dragonwocky
GPG Key ID: B570B11B1DFB50E4
4 changed files with 182 additions and 172 deletions

View File

@ -21,7 +21,7 @@ or a built-in feature like [userChrome.css](https://www.userchrome.org/).)
8. optional: modify the `resources/user.css` files to your liking.
9. run `customiser.py` to build changes.
done: run notion and enjoy
done: run notion and enjoy.
**oh no, now my app won't open!**
@ -77,7 +77,7 @@ to add these to the web version, copy lines 43 - 87 from `user.css` into your cs
- **close to tray**: close window to tray rather than closing outright
on click of `⨉`. does not apply if multiple notion windows are open. (default: false)
## styling
### styling
due to `customiser.py` setting up a direct link to `resources/user.css`,
changes will be applied instantly on notion reload
@ -230,3 +230,12 @@ as it is a per-table-column style, unlike all others here, it must be prepended
padding-right: 10px !important;
}
```
## other details
i have an unhealthy habit of avoiding capital letters. nothing enforces this, i just do it.
the notion logo belongs entirely to the notion team, and was sourced from their
[media kit](https://www.notion.so/Media-Kit-205535b1d9c4440497a3d7a2ac096286).
if you have any questions, check [my website](https://dragonwocky.me/) for contact details.

View File

@ -1,15 +1,15 @@
<!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>changelog | 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.svg" media="(prefers-color-scheme: dark)"><link rel="icon" href="web-logo.svg"><meta name="title" content="changelog | 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/changelog.html"><meta property="og:title" content="changelog"><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.svg"><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.svg" media="(prefers-color-scheme: dark)"><img src="web-logo.svg"></picture></div></div><ul class="nav"><li class="entry"><a href="index.html">notion enhancer</a></li><li class="entry"><p>resources</p></li><li class="entry"><a href="#changelog">changelog</a><ul><li class="level-3"><a href="#v050-wip">v0.5.0 (wip)</a></li><li class="level-3"><a href="#v041-2020-02-13">v0.4.1 (2020-02-13)</a></li><li class="level-3"><a href="#v040">v0.4.0</a></li><li class="level-3"><a href="#v030">v0.3.0</a></li><li class="level-3"><a href="#v020">v0.2.0</a></li><li class="level-3"><a href="#v010">v0.1.0</a></li></ul></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">
<h1 id="changelog">
<section class="block" id="changelog">
<h1>
<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>
</section>
<section class="block">
<h3 id="v050-wip">
<section class="block" id="v050-wip">
<h3>
<a href="#v050-wip">v0.5.0 (wip)</a>
</h3>
<ul>
@ -24,8 +24,8 @@ improved: scrollbar colours that fit better with notion&#39;s theming.</li>
<p><em>(forked by <a href="https://github.com/dragonwocky">@dragonwocky</a>.)</em></p>
</section>
<section class="block">
<h3 id="v041-2020-02-13">
<section class="block" id="v041-2020-02-13">
<h3>
<a href="#v041-2020-02-13">v0.4.1 (2020-02-13)</a>
</h3>
<ul>
@ -36,8 +36,8 @@ improved: scrollbar colours that fit better with notion&#39;s theming.</li>
</blockquote>
</section>
<section class="block">
<h3 id="v040">
<section class="block" id="v040">
<h3>
<a href="#v040">v0.4.0</a>
</h3>
<ul>
@ -50,8 +50,8 @@ improved: scrollbar colours that fit better with notion&#39;s theming.</li>
</ul>
</section>
<section class="block">
<h3 id="v030">
<section class="block" id="v030">
<h3>
<a href="#v030">v0.3.0</a>
</h3>
<ul>
@ -64,8 +64,8 @@ improved: scrollbar colours that fit better with notion&#39;s theming.</li>
</blockquote>
</section>
<section class="block">
<h3 id="v020">
<section class="block" id="v020">
<h3>
<a href="#v020">v0.2.0</a>
</h3>
<ul>
@ -75,8 +75,8 @@ improved: scrollbar colours that fit better with notion&#39;s theming.</li>
</ul>
</section>
<section class="block">
<h3 id="v010">
<section class="block" id="v010">
<h3>
<a href="#v010">v0.1.0</a>
</h3>
<ul>

View File

@ -1,5 +1,5 @@
/*
* Documentative Scripts
* Documentative
* (c) 2020 dragonwocky <thedragonring.bod@gmail.com>
* (https://dragonwocky.me/) under the MIT license
*/
@ -16,125 +16,109 @@ class Scrollnav {
throw Error('scrollnav: only 1 instance per page allowed!');
Scrollnav.prototype.INITIATED = true;
this.ID;
this.ticking = [];
this._menu = menu;
this._content = content;
this._sections = [...this._menu.querySelectorAll('ul li a')]
.map(el => {
try {
return this._content.querySelector(el.getAttribute('href'))
.parentElement;
} catch {
return null;
}
})
.filter(el => el);
this._topheading = this._sections[0].children[0];
this._links = [];
this._sections = [...this._menu.querySelectorAll('ul li a')].reduce(
(list, link) => {
if (!link.getAttribute('href').startsWith('#')) return list;
let section = this._content.querySelector(link.getAttribute('href'));
if (!section) return list;
this._scrolling = [];
this.build();
}
async build() {
this._content.addEventListener('scroll', this.scrollwatcher.bind(this));
window.onhashchange = this.hashwatcher.bind(this);
[...this._menu.querySelectorAll('ul li a')]
.filter(el => el.getAttribute('href').startsWith('#'))
.forEach(el => {
el.onclick = async ev => {
this._links.push(link);
link.onclick = async ev => {
ev.preventDefault();
this.set(el.getAttribute('href'));
this.scroll(() => {
let offset = this._content.querySelector(el.getAttribute('href'))
.parentElement.offsetTop;
if (offset < this._content.clientHeight / 2) offset = 0;
this._content.scroll({
top: offset,
behavior: 'smooth'
});
});
const ID = link.getAttribute('href');
this.highlightHeading(ID);
this.scrollContent(ID);
this.setHash(ID);
};
});
this.set();
this.showmenu();
await this.scroll(() => {
const ID = location.hash || '#' + this._topheading.id;
try {
this._content.querySelector(ID).parentElement.scrollIntoView(true);
} catch {
location.hash = '';
return [...list, section];
},
[]
);
this._topheading = `#${this._sections[0].id}`;
window.onhashchange = this.watchHash.bind(this);
this._content.addEventListener('scroll', ev => {
if (!this.ticking.length) {
this.ticking.push(1);
requestAnimationFrame(() => {
this.watchScroll(ev);
this.ticking.pop();
});
}
});
this.set(null, false);
return this;
}
set(ID) {
if (!ID || typeof ID !== 'string')
ID = location.hash || this._topheading.id;
if (!ID.startsWith('#')) ID = '#' + ID;
if (!this._menu.querySelector(`[href="${ID}"]`))
ID = '#' + this._topheading.id;
clearTimeout(this.hashloc);
this.hashloc = setTimeout(() => {
this._menu
.querySelectorAll('ul li a')
.forEach(el =>
el.getAttribute('href') === ID
? el.classList.add('active')
: el.classList.remove('active')
);
if (history.replaceState) {
history.replaceState(
null,
null,
ID === '#' + this._topheading.id ? '#' : ID
);
if (ID === '#' + this._topheading.id)
this._content.scroll({
top: 0,
behavior: 'smooth'
});
} else this._content.querySelector(ID).parentElement.scrollIntoView(true);
}, 100);
set(ID, smooth) {
this.highlightHeading(ID);
this.scrollMenu(ID, smooth);
this.scrollContent(ID, smooth);
this.setHash(ID);
}
scroll(func) {
return new Promise((resolve, reject) => {
try {
this._scrolling.push(true);
func();
setTimeout(() => {
this._scrolling.pop();
resolve(true);
}, 750);
} catch (err) {
reject(err);
}
parseID(ID) {
if (!ID || typeof ID !== 'string') ID = location.hash || this._topheading;
if (!ID.startsWith('#')) ID = `#${ID}`;
if (!this._links.find(el => el.getAttribute('href') === ID))
ID = this._topheading;
this.ID = ID;
return ID;
}
highlightHeading(ID) {
this.parseID(ID);
this._links.forEach(el =>
el.getAttribute('href') === this.ID
? el.classList.add('active')
: el.classList.remove('active')
);
return true;
}
watchHash(ev) {
ev.preventDefault();
if (ev.newURL !== ev.oldURL) {
this.set();
}
}
setHash(ID) {
if (!history.replaceState) return false;
this.parseID(ID);
history.replaceState(null, null, ID === this._topheading ? '#' : this.ID);
return true;
}
scrollContent(ID, smooth = true) {
this.ticking.push(1);
this.parseID(ID);
let offset = this._sections.find(el => `#${el.id}` === this.ID).offsetTop;
if (offset < this._content.clientHeight / 2) offset = 0;
this._content.scroll({
top: offset,
behavior: smooth ? 'smooth' : 'auto'
});
setTimeout(() => this.ticking.pop(), 1000);
return true;
}
showmenu(ID) {
if (!ID || typeof ID !== 'string')
ID = location.hash || this._topheading.id;
if (!ID.startsWith('#')) ID = '#' + ID;
if (!this._menu.querySelector(`[href="${ID}"]`))
ID = '#' + this._topheading.id;
let offset = this._menu.querySelector(`[href="${ID}"]`).parentElement
scrollMenu(ID, smooth = true) {
this.parseID(ID);
let offset = this._links.find(el => el.getAttribute('href') === this.ID)
.offsetTop;
if (offset < this._menu.clientHeight / 2) offset = 0;
clearTimeout(this.menupos);
this._menu.scroll({
top: offset,
behavior: 'smooth'
behavior: smooth ? 'smooth' : 'auto'
});
return true;
}
hashwatcher(ev) {
ev.preventDefault();
if (ev.newURL === ev.oldURL) return;
this.set();
this.showmenu();
}
scrollwatcher() {
if (this._scrolling.length) return;
watchScroll(ev) {
const viewport = this._content.clientHeight,
ID = this._sections.reduce(
(carry, el) => {
@ -159,17 +143,25 @@ class Scrollnav {
return pixels > carry[0] ? [pixels, el] : carry;
},
[0, null]
)[1].children[0].id;
this.set(ID);
this.showmenu(ID);
)[1].id;
this.ID = ID;
this.scrollMenu(this.ID);
clearTimeout(this.afterScroll);
this.afterScroll = setTimeout(
() => void (this.highlightHeading(this.ID) && this.setHash(this.ID)),
100
);
}
}
let constructed = false;
const construct = () => {
if (document.readyState !== 'complete' || constructed) return false;
constructed = true;
if (
location.pathname.endsWith('index.html') &&
window.location.protocol !== 'file:'
window.location.protocol === 'https:'
)
location.replace('./' + location.hash);
@ -197,6 +189,5 @@ const construct = () => {
}
};
if (document.readyState === 'complete') {
construct();
} else document.addEventListener('DOMContentLoaded', construct);
construct();
document.addEventListener('readystatechange', construct);

View File

@ -1,14 +1,14 @@
<!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.svg" media="(prefers-color-scheme: dark)"><link rel="icon" href="web-logo.svg"><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.svg"><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.svg" media="(prefers-color-scheme: dark)"><img src="web-logo.svg"></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="#this-is-a-fork">this is a fork</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-4"><a href="#wider-page-view">wider page view</a></li><li class="level-4"><a href="#thinner-cover-image">thinner cover image</a></li><li class="level-4"><a href="#table-columns-below-100px">table columns below 100px</a></li><li class="level-4"><a href="#hide--new-table-row">hide '+ new' table row</a></li><li class="level-4"><a href="#hide-calculations-table-row">hide calculations table row</a></li><li class="level-4"><a href="#hide--new-board-row">hide '+ new' board row</a></li><li class="level-4"><a href="#hide-board-view-hidden-columns">hide board view hidden columns</a></li><li class="level-4"><a href="#hide-board-view-add-a-group">hide board view 'add a group'</a></li><li class="level-4"><a href="#centre-align-table-column-headers">centre-align table column headers</a></li><li class="level-4"><a href="#smaller-table-column-header-icons">smaller table column header icons</a></li><li class="level-4"><a href="#remove-icons-from-table-column-headers">remove icons from table column headers</a></li><li class="level-4"><a href="#removingdecreasing-side-padding-for-tables">removing/decreasing side padding for tables</a></li><li class="level-4"><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>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.svg" media="(prefers-color-scheme: dark)"><link rel="icon" href="web-logo.svg"><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.svg"><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.svg" media="(prefers-color-scheme: dark)"><img src="web-logo.svg"></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="#this-is-a-fork">this is a fork</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-3"><a href="#styling">styling</a></li><li class="level-4"><a href="#wider-page-view">wider page view</a></li><li class="level-4"><a href="#thinner-cover-image">thinner cover image</a></li><li class="level-4"><a href="#table-columns-below-100px">table columns below 100px</a></li><li class="level-4"><a href="#hide--new-table-row">hide '+ new' table row</a></li><li class="level-4"><a href="#hide-calculations-table-row">hide calculations table row</a></li><li class="level-4"><a href="#hide--new-board-row">hide '+ new' board row</a></li><li class="level-4"><a href="#hide-board-view-hidden-columns">hide board view hidden columns</a></li><li class="level-4"><a href="#hide-board-view-add-a-group">hide board view 'add a group'</a></li><li class="level-4"><a href="#centre-align-table-column-headers">centre-align table column headers</a></li><li class="level-4"><a href="#smaller-table-column-header-icons">smaller table column header icons</a></li><li class="level-4"><a href="#remove-icons-from-table-column-headers">remove icons from table column headers</a></li><li class="level-4"><a href="#removingdecreasing-side-padding-for-tables">removing/decreasing side padding for tables</a></li><li class="level-4"><a href="#removingdecreasing-side-padding-for-boards">removing/decreasing side padding for boards</a></li><li class="level-2"><a href="#other-details">other details</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">
<h1 id="notion-enhancer">
<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>
</section>
<section class="block">
<h2 id="installation">
<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>
@ -27,7 +27,7 @@ even if you are running the script from the wsl).</li>
<li>optional: modify the <code>resources/user.css</code> files to your liking.</li>
<li>run <code>customiser.py</code> to build changes.</li>
</ol>
<p>done: run notion and enjoy</p>
<p>done: run notion and enjoy.</p>
<p><strong>oh no, now my app won&#39;t open!</strong></p>
<ol>
<li>kill any notion tasks in the task manager (<code>ctrl+shift+esc</code>).</li>
@ -37,8 +37,8 @@ even if you are running the script from the wsl).</li>
</ol>
</section>
<section class="block">
<h2 id="this-is-a-fork">
<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>,
@ -46,14 +46,14 @@ telegram: <a href="https://t.me/UserFromUkraine">UserFromUkraine</a>, discord: U
<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">
<h2 id="features">
<section class="block" id="features">
<h2>
<a href="#features">features</a>
</h2>
</section>
<section class="block">
<h3 id="titlebar">
<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>
@ -65,8 +65,8 @@ find the relevant button (read the comments) and replace its icon with your chos
replacing <code>element.innerHTML = &#39;&#39;;</code> with <code>element.innerHTML = &#39;🙄&#39;;</code>).</p>
</section>
<section class="block">
<h3 id="nicer-scrollbars">
<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
@ -74,8 +74,8 @@ ones that actually look as if they&#39;re part of notion.</p>
<p>to add these to the web version, copy lines 43 - 87 from <code>user.css</code> into your css customiser.</p>
</section>
<section class="block">
<h3 id="hotkeys">
<section class="block" id="hotkeys">
<h3>
<a href="#hotkeys">hotkeys</a>
</h3>
<ul>
@ -89,8 +89,8 @@ to your preference. you will need to run or re-run <code>customiser.py</code> af
</ul>
</section>
<section class="block">
<h3 id="tray">
<section class="block" id="tray">
<h3>
<a href="#tray">tray</a>
</h3>
<ul>
@ -104,10 +104,10 @@ on click of <code>⨉</code>. does not apply if multiple notion windows are open
</ul>
</section>
<section class="block">
<h2 id="styling">
<section class="block" id="styling">
<h3>
<a href="#styling">styling</a>
</h2>
</h3>
<p>due to <code>customiser.py</code> setting up a direct link to <code>resources/user.css</code>,
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>
@ -116,8 +116,8 @@ changes will be applied instantly on notion reload
(e.g. the &#39;+ new&#39; table row) it is recommended that you prepend each selector with <code>[data-block-id=&#39;ID&#39;]</code> (<a href="https://www.youtube.com/watch?v=6V7eqShm_4w">video tutorial on fetching IDs</a>).</p>
</section>
<section class="block">
<h4 id="wider-page-view">
<section class="block" id="wider-page-view">
<h4>
<a href="#wider-page-view">wider page view</a>
</h4>
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-peek-renderer</span> &gt; <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-child(2)</span> {
@ -125,8 +125,8 @@ changes will be applied instantly on notion reload
}</code></pre>
</section>
<section class="block">
<h4 id="thinner-cover-image">
<section class="block" id="thinner-cover-image">
<h4>
<a href="#thinner-cover-image">thinner cover image</a>
</h4>
<pre><code class="lang-css"><span class="hljs-selector-attr">[style^=<span class="hljs-string">'position: relative; width: 100%; display: flex; flex-direction: column; align-items: center; height: 30vh;'</span>]</span> {
@ -138,8 +138,8 @@ changes will be applied instantly on notion reload
}</code></pre>
</section>
<section class="block">
<h4 id="table-columns-below-100px">
<section class="block" id="table-columns-below-100px">
<h4>
<a href="#table-columns-below-100px">table columns below 100px</a>
</h4>
<p><strong>not recommended!</strong> this is unreliable and will cause bugs.
@ -163,8 +163,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
}</code></pre>
</section>
<section class="block">
<h4 id="hide--new-table-row">
<section class="block" id="hide--new-table-row">
<h4>
<a href="#hide--new-table-row">hide '+ new' table row</a>
</h4>
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-table-view-add-row</span> {
@ -172,8 +172,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
}</code></pre>
</section>
<section class="block">
<h4 id="hide-calculations-table-row">
<section class="block" id="hide-calculations-table-row">
<h4>
<a href="#hide-calculations-table-row">hide calculations table row</a>
</h4>
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-table-view-add-row</span> + <span class="hljs-selector-tag">div</span> {
@ -181,8 +181,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
}</code></pre>
</section>
<section class="block">
<h4 id="hide--new-board-row">
<section class="block" id="hide--new-board-row">
<h4>
<a href="#hide--new-board-row">hide '+ new' board row</a>
</h4>
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-board-group</span>
@ -191,8 +191,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
}</code></pre>
</section>
<section class="block">
<h4 id="hide-board-view-hidden-columns">
<section class="block" id="hide-board-view-hidden-columns">
<h4>
<a href="#hide-board-view-hidden-columns">hide board view hidden columns</a>
</h4>
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-board-view</span> &gt; <span class="hljs-selector-attr">[data-block-id]</span> &gt; <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:nth-last-child(2)</span>,
@ -201,8 +201,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
}</code></pre>
</section>
<section class="block">
<h4 id="hide-board-view-add-a-group">
<section class="block" id="hide-board-view-add-a-group">
<h4>
<a href="#hide-board-view-add-a-group">hide board view 'add a group'</a>
</h4>
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-board-view</span> &gt; <span class="hljs-selector-attr">[data-block-id]</span> &gt; <span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:last-child</span>,
@ -211,8 +211,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
}</code></pre>
</section>
<section class="block">
<h4 id="centre-align-table-column-headers">
<section class="block" id="centre-align-table-column-headers">
<h4>
<a href="#centre-align-table-column-headers">centre-align table column headers</a>
</h4>
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-table-view-header-cell</span> &gt; <span class="hljs-selector-tag">div</span> &gt; <span class="hljs-selector-tag">div</span> {
@ -220,8 +220,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
}</code></pre>
</section>
<section class="block">
<h4 id="smaller-table-column-header-icons">
<section class="block" id="smaller-table-column-header-icons">
<h4>
<a href="#smaller-table-column-header-icons">smaller table column header icons</a>
</h4>
<pre><code class="lang-css"><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>
@ -233,8 +233,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
}</code></pre>
</section>
<section class="block">
<h4 id="remove-icons-from-table-column-headers">
<section class="block" id="remove-icons-from-table-column-headers">
<h4>
<a href="#remove-icons-from-table-column-headers">remove icons from table column headers</a>
</h4>
<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> {
@ -242,8 +242,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
}</code></pre>
</section>
<section class="block">
<h4 id="removingdecreasing-side-padding-for-tables">
<section class="block" id="removingdecreasing-side-padding-for-tables">
<h4>
<a href="#removingdecreasing-side-padding-for-tables">removing/decreasing side padding for tables</a>
</h4>
<pre><code class="lang-css"><span class="hljs-selector-attr">[style^=<span class="hljs-string">'flex-shrink: 0; flex-grow: 1; width: 100%; max-width: 100%; display: flex; align-items: center; flex-direction: column; font-size: 16px; color: rgba(255, 255, 255, 0.9); padding: 0px 96px 30vh;'</span>]</span>
@ -261,8 +261,8 @@ as it is a per-table-column style, unlike all others here, it must be prepended
}</code></pre>
</section>
<section class="block">
<h4 id="removingdecreasing-side-padding-for-boards">
<section class="block" id="removingdecreasing-side-padding-for-boards">
<h4>
<a href="#removingdecreasing-side-padding-for-boards">removing/decreasing side padding for boards</a>
</h4>
<pre><code class="lang-css"><span class="hljs-selector-class">.notion-board-view</span> {
@ -270,5 +270,15 @@ as it is a per-table-column style, unlike all others here, it must be prepended
<span class="hljs-attribute">padding-right</span>: <span class="hljs-number">10px</span> <span class="hljs-meta">!important</span>;
}</code></pre>
</section>
<section class="block" id="other-details">
<h2>
<a href="#other-details">other details</a>
</h2>
<p>i have an unhealthy habit of avoiding capital letters. nothing enforces this, i just do it.</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">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 &amp; Uzver, under the <a href="https://choosealicense.com/licenses/mit/">MIT license</a>.</p>
</footer><nav><a class="next" href="changelog.html"></a></nav></article></div></body></html>