Chrome & Firefox extension for Notion to add 20+ features like sticky outline, small text & full width by default, hide comments & help button, bolder text etc. Download here: https://gourav.io/notion-boost
I'm a programmer,i always use “code blocks”,sometimes the code to long,then the “code blocks” very height,
I want to turn on or off 'max-height' with Notion boost plug,I have written some code and have implemented this function, but I am not very good at Javascript and css,I am not very good at english,thank you very much。
console.log('Notion Custom CodeBlock Max Height~')
const body = document.getElementsByClassName('notion-body').item(0);
if (body) {
const config = {childList: true};
const callback = () => {
console.log('notion-body childList has changed')
this.content()
};
const observer = new MutationObserver(callback);
observer.observe(body, config);
// observer.disconnect();
}
const callback = () => {
console.log('notion-page-content childList has changed')
this.setMaxHeight()
};
const observer = new MutationObserver(callback);
function content() {
const content = document.getElementsByClassName('notion-page-content').item(0)
if (content) {
this.setMaxHeight()
const config = {childList: true};
observer.observe(content, config);
// observer.disconnect();
}
}
function setMaxHeight() {
const content = document.getElementsByClassName('notion-page-content').item(0)
if (!content) {
return
}
const notionCodeBlocks = content.childNodes
for (let i = 0; i < notionCodeBlocks.length; i++) {
const notionCodeBlock = notionCodeBlocks[i]
const classAttribute = notionCodeBlock.getAttribute('class')
if (classAttribute.indexOf('notion-code-block') !== -1) {
notionCodeBlock.style.maxHeight = '300px'
notionCodeBlock.style.overflow = 'auto'
const firstChild = notionCodeBlock.childNodes[0]
if (firstChild) {
firstChild.style.maxHeight = '300px'
firstChild.style.overflow = 'auto'
const firstGrandson = firstChild.childNodes[0]
firstGrandson.style.maxHeight = '300px'
firstGrandson.style.overflow = 'auto'
}
}
}
}
I'm a programmer,i always use “code blocks”,sometimes the code to long,then the “code blocks” very height, I want to turn on or off 'max-height' with Notion boost plug,I have written some code and have implemented this function, but I am not very good at Javascript and css,I am not very good at english,thank you very much。