dragonwocky/notion-enhancer
1
0
Fork 0
mirror of https://github.com/notion-enhancer/notion-enhancer.git synced 2025-04-19 11:09:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

Basic Functionality

Browse Source
This commit is contained in:
CloudHill 2020-10-20 22:02:57 +07:00
parent b16281f28e
commit 230688951c
2 changed files with 77 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
mods/scroll-to-top/mod.js Normal file
View File

@ -0,0 +1,48 @@
/*
* scroll-to-top
* (c) 2020 dragonwocky <thedragonring.bod@gmail.com> (https://dragonwocky.me/)
* (c) 2020 CloudHill
* under the MIT license
*/
"use strict";
const { createElement } = require("../../pkg/helpers.js");
module.exports = {
id: "0a958f5a-17c5-48b5-8713-16190cae1959",
tags: ["extension"],
name: "scroll-to-top",
desc: "add a scroll to top button.",
version: "1.0.0",
author: "CloudHill",
hacks: {
"renderer/preload.js"(store, __exports) {
document.addEventListener("readystatechange", (event) => {
if (document.readyState !== "complete") return false;
const attempt_interval = setInterval(enhance, 500);
function enhance() {
if (!document.querySelector(".notion-frame")) return;
clearInterval(attempt_interval);
const container = document.createElement('div');
const help = document.querySelector('.notion-help-button');
const scroll = createElement(
'<div class="notion-scroll-button" role="button">&#129049;</div>' // 🠙;
)
container.className = "bottom-right-buttons";
help.after(container);
container.append(scroll);
container.append(help);
scroll.addEventListener('click', () => {
document
.querySelector('.notion-frame > .notion-scroller')
.scrollTop = 0;
})
}
});
}
},
};

29
mods/scroll-to-top/style.css Normal file
View File

@ -0,0 +1,29 @@
.bottom-right-buttons {
position: absolute;
bottom: 33px;
right: 33px;
cursor: default;
}
.bottom-right-buttons > div {
margin-top: 8px;
user-select: none;
transition: opacity 700ms ease 0s, color 700ms ease 0s;
cursor: pointer;
position: static !important;
width: 36px;
height: 36px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 100%;
font-size: 20px;
background: var(--theme--interactive_hover) !important;
box-shadow: 0 0 0 0.5px var(--theme--interactive_hover-border) !important;
}