代码片段, 用于简化界面操作

基本上是参考 基于思源笔记默认主题的优化代码片段,做的确实有点变态 改的。

暂时定性为自用,怎么简单怎么来。

可能有一些冗余的测试代码,现在有点顾不上,看看之后是不是再调整一下

样式修改

Clip20240806192115.png

首页相关简化

/** 首页面板修改 **/
/** 顶部当前页面标题 **/
.fn__flex-1.fn__ellipsis
{
	opacity: 0 !important;
}

/** 左右侧停靠栏和底部状态栏 **/
#status,
#dockLeft, #dockRight
{
	display: none !important;
}

/** 顶部默认按钮:前进后退、订阅、插件、搜索、外观和数据同步隐藏 **/
#toolbar #barBack,
#toolbar #barForward,
#toolbar #barSync,
#toolbar #barMode,
#toolbar #barSearch,
#toolbar #barPlugins,
#toolbar #toolbarVIP
{
	display: none !important;
}

/** 顶部插件按钮全部隐藏 **/
#toolbar [id^=plugin]
{
    display: none!important;
}



/** 文档树::已关闭的笔记本项 **/
li.b3-list-item[data-type="toggle"]
{
	display: none !important;
}

/** 页签::切换和新建文档 **/
div.layout__center ul.layout-tab-bar--readonly >li > span.block__icon
{
	display: none !important;
}

/** 页签::当前页签底部划线取消圆角,缩短 **/
div.layout__center ul:not(.layout-tab-bar--readonly)>li.item--focus::after
{
	border-radius: 0;
	width: 91%;
}



/** 隐藏图标,不包含钉住文档的图标 **/
.b3-list-item__icon,
li:not(.item--pin) > .item__icon
{
	display: none !important;
}

/** 隐藏所有菜单项的分割线 **/
.b3-menu__separator {
    display: none!important;
}
.config__tab-container .b3-label:not(.b3-label--inner) {
    box-shadow: none!important;
}
/** 隐藏提示框 **/
#tooltip
{
    display: none!important;
}
.b3-tooltips:hover::before,
.b3-tooltips:hover::after
{
    display: none!important;
}

编辑相关简化

/** 面包屑仅保留锁定编辑,退出聚焦 **/
.protyle-breadcrumb > div,
.protyle-breadcrumb > button:not([data-type="readonly"]):not([data-type="exit-focus"])
{
display: none !important;
}
/** 设置滑动到面包屑才显示按钮,避免视觉中心不平衡 **/
.protyle-breadcrumb
{
opacity: 0;
transition: opacity 0.3s ease;
}
.protyle-breadcrumb:hover
{
opacity: 1;
}
/** 题头区域只保留标签相关 **/
.protyle-background__img,
.protyle-background__icon,
.protyle-background__action > button:not([data-type="tag"])
{
display: none !important;
}
/** 文档属性仅保留命名 **/
.protyle-attr--alias,
.protyle-attr--memo,
.protyle-attr--refcount
{
display: none !important;
}
/** 移除辅助滚动进度条 **/
.protyle-scroll
{
display: none !important;
}
/** 块图标仅保留展开折叠 **/
.protyle-gutters > button:not([data-type="fold"])
{
opacity: 0 !important;
}
/** 隐藏选中工具栏 **/
.protyle-toolbar > *:not([data-type="block-ref"]):not([data-type="a"]):not([data-type="strong"]):not([data-type="em"]):not([data-type="mark"]) {
display: none!important;
}

脚本修改

快速将闪卡从页签右侧打开

// 用于设置打开的闪卡页面都直接在页面右侧打开
(function () {
    function query(selector, multiple = false) {
        return multiple ? document.querySelectorAll(selector) : document.querySelector(selector);
    }
    let observer = new MutationObserver(mutations => {
        mutations.forEach(mutation => {
            if (mutation.type === "childList" && mutation.addedNodes.length > 0) {
                let thisNode = mutation.addedNodes[0];
                if (thisNode && thisNode.querySelector && thisNode.innerText && thisNode.innerText.includes('闪卡')) {
                    const sticktab = query('.b3-dialog__body .card__main .block__icons>div[data-type="sticktab"]');
                    if (sticktab) {
                        sticktab.click();
                        setTimeout(() => {
                            let open_item = query("#commonMenu > div.b3-menu__items > button");
                            if (open_item) {
                                open_item.click();
                            }
                        }, 40)
                    }
                }
            }
        });
    });
    observer.observe(document.body, {
        childList: true,
        subtree: true
    });
})();

简化设置菜单

Clip20240806191835.png

// 用于设置打开的闪卡页面都直接在页面右侧打开
(function () {

    function logNodeInfo(node) {
        let json = {
            "nodeType": node.nodeType,
            "nodeName": node.nodeName,
            "nodeValue": node.nodeValue,
            "textContent": node.textContent,
            "innerText": node.innerText,
            "innerHTML": node.innerHTML,
            "outerHTML": node.outerHTML,
            "className": node.className
        };

        // 使用 console.group 创建一个分组
        console.group('Node Info');
        console.log('NodeType:', json.nodeType);
        console.log('NodeName:', json.nodeName);
        console.log('NodeValue:', json.nodeValue === null ? 'null' : json.nodeValue);
        console.log('TextContent:', json.textContent);
        console.log('InnerText:', json.innerText);
        console.log('InnerHTML:', json.innerHTML);
        console.log('OuterHTML:', json.outerHTML);
        console.log('ClassName:', json.className);
        // 结束分组
        console.groupEnd();
    }
    function bindObserver(options) {
        const { onAddedNodes, onFirstNodes, target = document.body, config = { childList: true, subtree: true } } = options;

        if (typeof onAddedNodes !== 'function' && typeof onFirstNodes !== 'function') {
            throw new Error('At least one of the callback functions must be provided.');
        }

        const observer = new MutationObserver(mutations => {
            mutations.forEach(mutation => {
                if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
                    try {
                        if (onFirstNodes) {
                            onFirstNodes(mutation.addedNodes[0]);
                        }
                        if (onAddedNodes) {
                            onAddedNodes(mutation.addedNodes)
                        }
                    } catch (error) {
                        console.error('Error handling mutations:', error);
                    }
                }
            });
        });

        observer.observe(target, config);

        return {
            stop: () => observer.disconnect(),
            isActive: () => !observer.disconnected
        };
    }
    function handleError(e) {
        if (e instanceof TypeError || e.message.includes('Cannot read properties of undefined')) {
            // 为了避免写冗长判断,这里直接忽略这类错误
        } else {
            console.error('An unexpected error occurred:', e);
        }
    }
    const config = {
        hiddenSettingsMenu: [
            "闪卡", "导出", "AI", "资源", "搜索", "账号", "云端", "发布"
        ],

        hiddenSettingsItem: [
            // 编辑器 
            "自适应宽度", "两侧对齐", "从右到左(RTL)", "只读模式",
            "是否显示书签、命名、别名、备注和引用计数",
            "是否显示网络图片角标",
            "嵌入块面包屑", "列表大纲反向缩进", "列表项圆点/数字单击聚焦", "拼写检查", "仅搜索文档",
            "代码块换行", "代码块连字", "代码块显示行号",
            "PlantUML 伺服地址", "反向链接默认展开数", "反向提及默认展开数",
            "历史生成间隔(分钟,设置为 0 则禁用)", "历史保留天数", "浮窗触发方式",
            "字体", "快速调整字号", "字号", "Tab 空格数",
            "KaTex 宏定义", "允许执行 HTML 块内脚本",
            "虚拟引用关键字包含列表", "虚拟引用关键字排除列表",
            "动态加载块数", "块引动态锚文本最大长度",
            // 文档树
            "始终定位打开的文档", "在当前页签中打开", "启动时关闭所有页签",
            "允许创建深度大于 7 层的子文档", "删除文档时不需要确认", "使用单行保存",
            // 外观
            "图标", "代码块主题", "语言", "恢复默认窗口",
            "隐藏底部状态栏", "关闭按钮设置",
            // 关于
            "Google Analytics", "自动上传报错信息和诊断数据", "网络伺服", "数据仓库密钥", "数据仓库清理",
            "API token", "网络代理", "访问授权码", "在浏览器上使用",
            "思源笔记" // emm
        ],
    }


    function handleSettingSearch(node) {
        if (node.innerHTML.includes('config__tab-title')) {
            node.querySelector('.config__tab-title').style.display = "none";
            node.querySelector('.b3-form__icon').style.display = "none";
            node.querySelector('.config__tab-hr').style.display = "none";
        }
    }

    function configureGridDisplay(options, gridOptions) {
        // 获取宫格容器
        const gridContainer = document.getElementById('configBazaarDownloaded');
        // 设置样式修改标记
        if (gridContainer.getAttribute('data-modified') === '1') return;
        // 设置宫格容器的CSS Grid布局参数
        gridContainer.style.display = 'grid';
        gridContainer.style.gridTemplateColumns = gridOptions.gridColumns; // 例如 "repeat(3, 1fr)"
        gridContainer.style.gap = gridOptions.gap; // 例如 "16px"

        // 根据options控制宫格项内部元素的显示或隐藏




        const cards = gridContainer.querySelectorAll('.b3-card');
        cards.forEach(card => {
            const despElement = card.querySelector('.b3-card__desc');
            const imgElement = card.querySelector('.b3-card__img');
            despElement.style.display = options.desp === 1 ? '' : 'none';
            imgElement.style.display = options.img === 1 ? '' : 'none';
        });


        if (options.enableFrist === 1) {
            const cardsArray = Array.from(cards);

            cardsArray.sort((a, b) => {
                const aCheckbox = a.querySelector('.b3-switch');
                const bCheckbox = b.querySelector('.b3-switch');

                if (aCheckbox.checked && !bCheckbox.checked) return -1;
                if (!aCheckbox.checked && bCheckbox.checked) return 1;
                return 0;
            });

            const container = document.getElementById('configBazaarDownloaded');

            while (container.firstChild) {
                container.removeChild(container.firstChild);
            }

            cardsArray.forEach(card => {
                container.appendChild(card);
            });
        }

        gridContainer.setAttribute('data-modified', '1');
        // 三秒后移除标记
        setTimeout(() => {
            gridContainer.removeAttribute('data-modified');
        }, 3000);
    }


    function bazaarSimplify(node) {
        let hideExtends = [
            "主题", "图标", "模板"
        ]
        let tabBar = node.querySelectorAll(".layout-tab-bar>div");
        let tabBtns = node.querySelectorAll(".config-bazaar__title>button[data-type]");

        hideExtends.forEach(label => {


            tabBar.forEach(childNode => {
                let itemText = childNode.querySelector(".item__text");

                if (itemText.innerText === label) {
                    childNode.style.display = "none";
                }
            });
            tabBtns.forEach(childNode => {
                if (childNode.innerHTML.includes(label)) {
                    childNode.style.display = "none";
                    childNode.previousElementSibling.style.display = "none";
                }

            });
        })

        // 可选:使搜索占满宽度
        let searchInput = node.querySelectorAll(".config-bazaar__title .b3-form__icon");
        searchInput.forEach(input => input.style.width = "100%");
    }

    const handleNode = node => {
        try {
            if (node.innerHTML.includes("config__panel")) {
                // 隐藏设置列表
                config.hiddenSettingsMenu.forEach(label => {
                    node.querySelectorAll("li[data-name]").forEach(childNode => {

                        if (childNode.innerText === label) {
                            childNode.remove();
                        }
                    });
                });
                config.hiddenSettingsItem.forEach(item => {
                    node.querySelectorAll(".b3-label").forEach(childNode => {
                        if (childNode.innerHTML.includes(item)) {
                            childNode.style.display = "none";
                        }
                    });
                });

                // 隐藏设置搜索
                handleSettingSearch(node);
            }

            if (
                node.parentElement.className.includes("config__tab-container")
            ) {

                let config_items = document.querySelectorAll(".config__tab-container:not(.fn__none) .b3-label:not(.fn__none)");


                config_items.forEach(childNode => {

                    config.hiddenSettingsItem.forEach(item => {
                        // 第一个条件用于排除移除快捷键列表
                        if (
                            !childNode.id && childNode.innerHTML.includes(item)
                        ) {
                            childNode.style.display = "none";
                        }
                    });
                });

                // 集市的简化
                if (node.parentElement.dataset.name === 'bazaar') {
                    bazaarSimplify(node);
                }
            }

            // 已知卸载插件等状态变化后初始化的列表不会同步更新变化
            if (node.innerHTML.includes("b3-card__img")) {
                configureGridDisplay({ title: 1, desp: 0, img: 0, enableFrist: 1}, { gridColumns: "repeat(3, 1fr)", gap: "0px" });
            }

        } catch (e) {
            handleError(e);
            // console.log(e);

        }
    };

    bindObserver({ onFirstNodes: handleNode });
})();

简化提示菜单

Clip20240806191931.png

// 用于设置打开的闪卡页面都直接在页面右侧打开
(function () {
    function bindObserver(options) {
        const { onAddedNodes, onFirstNodes, target = document.body, config = {
            childList: true, subtree: true,
            attributes: true,
            characterData: true
        } } = options;

        if (typeof onAddedNodes !== 'function' && typeof onFirstNodes !== 'function') {
            throw new Error('At least one of the callback functions must be provided.');
        }

        const observer = new MutationObserver(mutations => {
            mutations.forEach(mutation => {
                if ((mutation.type === 'childList' && mutation.addedNodes.length > 0)  || mutation.type === "characterData") {
                    try {
                        if (onFirstNodes) {
                            onFirstNodes(mutation.addedNodes[0]);
                        }
                        if (onAddedNodes) {
                            mutation.addedNodes.forEach(node => onAddedNodes(node));
                        }
                    } catch (error) {
                        console.error('Error handling mutations:', error);
                    }
                }
            });
        });

        observer.observe(target, config);

        return {
            stop: () => observer.disconnect(),
            isActive: () => !observer.disconnected
        };
    }
    function handleError(e) {
        if (e instanceof TypeError || e.message.includes('Cannot read properties of undefined')) {
            // 为了避免写冗长判断,这里直接忽略这类错误
        } else {
            console.error('An unexpected error occurred:', e);
        }
    }

    const config = {
        hiddenHintMenus: [
            "AI Chat", "引用","嵌入块", "数据库",
            "一级标题", "二级标题", "三级标题", "四级标题", "五级标题", "六级标题",
            "无序列表", "有序列表", "任务列表", "引述", "代码块", "表格",
            "分隔线", "公式块", "表情", "链接", "粗体", "斜体", "HTML",
            "下划线", "删除线", "标记", "上标", "下标", "标签",
            "行级代码", "行级公式", "插入图片或文件", "插入 IFrame 链接",
            "插入图片链接", "插入视频链接", "插入音频链接", 
            "ABC", "Chart", "FlowChart", "Graphviz", "Mermaid",
            "信息样式", "成功样式", "警告样式", "错误样式", "清除样式",
        ]
    };
  

    const handleFirstNode = node => {
         try {
      
            if (node.offsetParent.className.includes("hint--menu")) {
                config.hiddenHintMenus.forEach(function (item) {
              
                    node.childNodes.forEach(function (childNode) {
                  
                        if (childNode.innerHTML.includes(item)) {
                            childNode.remove();
                        }
                    });
                });
                node.firstElementChild.classList.add("b3-list-item--focus");
            }
        } catch (e) {
            handleError(e);
            // console.log(e);
      
        }
    };

    bindObserver({ onFirstNodes: handleFirstNode });
})();

简化鼠标菜单

目前有点问题,多选块时的 外观 项移除不掉;目

简单实现了 js 片段,展开菜单项 - 链滴 (ld246.com) 中的功能,用于快速展开插件项

Clip20240806191630.png

// 用于设置打开的闪卡页面都直接在页面右侧打开
(function () {

    function logNodeInfo(node) {
        let json = {
            "nodeType": node.nodeType,
            "nodeName": node.nodeName,
            "nodeValue": node.nodeValue,
            "textContent": node.textContent,
            "innerText": node.innerText,
            "innerHTML": node.innerHTML,
            "outerHTML": node.outerHTML,
            "className": node.className
        };

        // 使用 console.group 创建一个分组
        console.group('Node Info');
        console.log('NodeType:', json.nodeType);
        console.log('NodeName:', json.nodeName);
        console.log('NodeValue:', json.nodeValue === null ? 'null' : json.nodeValue);
        console.log('TextContent:', json.textContent);
        console.log('InnerText:', json.innerText);
        console.log('InnerHTML:', json.innerHTML);
        console.log('OuterHTML:', json.outerHTML);
        console.log('ClassName:', json.className);
        // 结束分组
        console.groupEnd();
    }
    function bindObserver(options) {
        const { onAddedNodes, onFirstNodes, target = document.body, config = { childList: true, subtree: true } } = options;

        if (typeof onAddedNodes !== 'function' && typeof onFirstNodes !== 'function') {
            throw new Error('At least one of the callback functions must be provided.');
        }

        const observer = new MutationObserver(mutations => {
            mutations.forEach(mutation => {
                if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
                    try {
                        if (onFirstNodes) {
                            onFirstNodes(mutation.addedNodes[0]);
                        }
                        if (onAddedNodes) {
                            mutation.addedNodes.forEach(node => onAddedNodes(node));
                        }
                    } catch (error) {
                        console.error('Error handling mutations:', error);
                    }
                }
            });
        });

        observer.observe(target, config);

        return {
            stop: () => observer.disconnect(),
            isActive: () => !observer.disconnected
        };
    }
    function handleError(e) {
        if (e instanceof TypeError || e.message.includes('Cannot read properties of undefined')) {
            // 为了避免写冗长判断,这里直接忽略这类错误
        } else {
            console.error('An unexpected error occurred:', e);
        }
    }
    const config = {
        hiddenCommonMenus: [

            // // 主菜单

            "面板", "布局", "日记", "闪卡", "最近的文档", "锁屏", "用户指南", "反馈", "开发者工具", "退出应用",

            // 右键菜单::笔记本

            "关闭", "搜索", "替换",

            // 右键菜单::文本

            "粘贴", "粘贴为纯文本", "粘贴转义文本", "全选", "复制纯文本", "剪切",

            // 插件相关

            "制卡", "插入写作式闪卡", "制卡并发到 daily card", "制卡并发到 daily card (无引用)",
            "渐进阅读(摘抄模式)", "文档与子文档闪卡优先级", "文档与子文档闪卡推迟", "恢复所有暂停的闪卡",
            "为闪卡设置优先级", "推迟/取消推迟", "添加图片遮挡层",

            // 右键菜单::操作页签

            "关闭未修改的页签", "关闭左侧页签", "关闭右侧页签", "分屏", "移动到新窗口",

            // 右键菜单::操作文档块

            "移动", "属性", "打开",

            // 右键菜单::复制

            "复制块 Markdown 链接", "复制可读路径", "复制 文本*", "复制为副本",

            // 右键菜单::操作块

            "人工智能", "聚焦", "聚焦到上层", "起始插入块", "末尾插入块",
            "跳转到父块的下一个块", "跳转到父块的上一个块", "跳转到父块",
            "折叠/展开", "外观", "宽度", "微信提醒", "快速制卡",
            "代码块", "带子标题转换", "删除 标题及下方块",

            // 右键菜单::转换为

            "段落", "一级标题", "二级标题", "三级标题", "四级标题", "五级标题", "六级标题",
            "引述",

            // 多选右键::
            "合并 超级块", "布局", "外观"
        ]
    }


    function expandSubMenuIfSingleTopItem() {
        // 获取 #commonMenu 下的所有 .b3-menu__items 容器
        const menu = document.getElementById('commonMenu');
        const topLevelItemsContainer = menu.querySelector('.b3-menu__items');
  
        // 检查 .b3-menu__items 容器中除了分隔符外的菜单项数量
        const topLevelItemCount = Array.from(topLevelItemsContainer.childNodes).filter(
            child => child.classList.contains('b3-menu__item') && !child.classList.contains('b3-menu__separator')
        ).length;
  
        // 检查是否只有一个顶层菜单项(除去分隔符和其他非菜单项)
        if (topLevelItemCount === 1) {
            const singleItem = topLevelItemsContainer.querySelector('.b3-menu__item:not(.b3-menu__separator)');
  
            // 确保找到了单个菜单项并且它包含子菜单
            if (singleItem && singleItem.querySelector('.b3-menu__submenu')) {
                const submenu = singleItem.querySelector('.b3-menu__submenu');
                const submenuItems = submenu.querySelectorAll('.b3-menu__item');
  
                // 将子菜单项移动到 #commonMenu 中,紧随singleItem之后
                Array.from(submenuItems).forEach(subItem => {
                    singleItem.parentNode.insertBefore(subItem, singleItem.nextSibling);
                });
  
                // 如果需要,可以删除原始的包含子菜单的菜单项
                // singleItem.remove();
            }
        }
    }

    function hideItemByName(node, rmvLabel) {

        try {
            // 先移除子菜单项
            if (node.innerHTML.includes("b3-menu__submenu")) {
          
                let subMenu = node.querySelector(".b3-menu__submenu");
  
                let subMenuChildren = subMenu.childNodes[0].childNodes;
  
                subMenuChildren.forEach(function (childNode) {
                    let label = childNode.querySelector(".b3-menu__label");
                    if (label && label.innerText && label.innerText === rmvLabel) {
                        childNode.remove();
                    }
  
                    if (childNode.innerHTML.includes("b3-menu__submenu")) {
                        hideItemByName(childNode, rmvLabel);
  
                    }
  
                });
  
                // 如果子项被删完,则连当前子菜单也删除
                if (subMenuChildren.length === 0) {
                    node.remove();
                }
  
  
            }
            // 移除一级菜单子项
            if (node.querySelector(".b3-menu__label").innerText === rmvLabel) {
          
                node.remove();
            }
        } catch (error) {
            console.log("error", error);
      
        }
    }

    const handleFirstNode = node => {
        try {
            if (node.className.includes("b3-menu__item")) {
                config.hiddenCommonMenus.forEach(item => {
              
                    hideItemByName(node, item);
                });
                // 看情况,用于只有一个插件子菜单时展开
                expandSubMenuIfSingleTopItem();
            }
        } catch (e) {
            handleError(e);
        }
    };

    bindObserver({ onFirstNodes: handleFirstNode });
})();
  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    20516 引用 • 79988 回帖

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • xqh042 1

    写了个很生草的脚本,简化色彩工具。(这里懒得写监听直接挂循环了,css 用来删组件,js 用来注入行内样式

    默认颜色为:当前字体颜色、渐进阅读插件在分片中改变文字后出现的黄色,链接的蓝色,引用色

    纯自用了属于是:

    Clip20240806213057.png

    /** 颜色工具 **/
    .protyle-font>div:nth-Child(1),
    .protyle-font>div:nth-Child(2),
    .protyle-font>div:nth-Child(3),
    .protyle-font>div:nth-Child(4),
    .protyle-font>div:nth-Child(8),
    .protyle-font>div:nth-Child(12),
    .protyle-font>div:nth-Child(13),
    .protyle-font>div:nth-Child(14),
    .protyle-font>div:nth-Child(15),
    .protyle-font>div:nth-Child(16),
    .protyle-font>div:nth-Child(17),
    .protyle-font>div:nth-Child(18),
    .protyle-font>div:nth-Child(19),
    .protyle-font>div:nth-Child(20),
    .protyle-font>div:nth-Child(21),
    .protyle-font>div:nth-Child(22),
    .protyle-font>div:nth-Child(23),
    .protyle-font>div:nth-Child(24),
    .protyle-font>div:nth-Child(11)>button:nth-Child(5),
    .protyle-font>div:nth-Child(11)>button:nth-Child(6),
    .protyle-font>div:nth-Child(11)>button:nth-Child(7),
    .protyle-font>div:nth-Child(11)>button:nth-Child(8),
    .protyle-font>div:nth-Child(11)>button:nth-Child(9),
    .protyle-font>div:nth-Child(11)>button:nth-Child(10),
    .protyle-font>div:nth-Child(11)>button:nth-Child(11),
    .protyle-font>div:nth-Child(11)>button:nth-Child(12),
    .protyle-font>div:nth-Child(11)>button:nth-Child(13),
    .protyle-font>div:nth-Child(11)>button:nth-Child(14)
    {
        display: none!important;
    }
    
    
    
    
    (function () {
       setInterval(()=>{
          document.querySelectorAll('.protyle-font > div:nth-child(11) > button').forEach((button, index) => {
            switch (index + 1) {
              case 1:
                button.style.color = 'var(--b3-theme-on-background)';
                break;
              case 2:
                button.style.color = 'var(--b3-font-color7)';
                break;
              case 3:
                button.style.color = 'var(--b3-protyle-inline-link-color)';
                break;
              case 4:
                button.style.color = 'var(--b3-protyle-inline-blockref-color)';
                button.style.opacity = '.86';
                break;
            }
          });
       }, 200)
    })();