请问如何修改默认的备注弹窗的字体,字号,窗口大小, 原来的字体太小, 太费眼睛了, 感谢感谢!
相关帖子
-
wilsons • • 1付费者 捐赠者
css 改不了,需要 js 修改
代码
// 修改备注的样式 { // 这里设置样式即可 const styles = { width: '400px', // 窗口宽,严格意义上是输入框的宽高,修改这个会自动让窗口变化 height: '200px', // 窗口高,同上 fontSize: '18px', // 字体大小 lineHeight: '180%', // 行间距 color: '#ff0000', // 文字颜色,不修改把折行删除或注释即可 fontFamily: '"中華民國字體", var(--b3-font-family-protyle)', // 字体,修改第一个双引号里的内容即可 }; observerProtyleUtil((util)=>{ const isMemo = util.querySelector('.fn__flex-1.resize__move')?.textContent?.trim() === window.siyuan.languages.memo; if(!isMemo) return; const textarea = util.querySelector('textarea'); if(!textarea) return; Object.assign(textarea.style, styles); }); function observerProtyleUtil(callback) { let hasEmit = false; // 1. 创建 MutationObserver 实例 const observer = new MutationObserver((mutationsList) => { mutationsList.forEach((mutation) => { // 2. 获取目标元素 const targetElement = mutation.target; // 3. 检查目标元素是否是 .protyle .protyle-util if (targetElement.matches('.protyle .protyle-util')) { // 4. 检查 .fn__none 类是否被删除 if (!targetElement.classList.contains('fn__none')) { if(hasEmit) return; hasEmit = true; callback(targetElement); setTimeout(() => { hasEmit = false; }, 100); } } }); }); // 5. 配置并启动监听 observer.observe(document.querySelector('.layout__center, #editor')||document.body, { //childList: true, // 监控子节点的变化 attributes: true, // 监听属性变化 attributeFilter: ['class'], // 只监听 class 属性 subtree: true, // 监听所有后代元素 }); } }
只需要修改 styles 参数里的样式即可。
-
css 改不了,需要 js 修改
代码
// 修改备注的样式 { // 这里设置样式即可 const styles = { width: '400px', // 窗口宽,严格意义上是输入框的宽高,修改这个会自动让窗口变化 height: '200px', // 窗口高,同上 fontSize: '18px', // 字体大小 lineHeight: '180%', // 行间距 color: '#ff0000', // 文字颜色,不修改把折行删除或注释即可 fontFamily: '"中華民國字體", var(--b3-font-family-protyle)', // 字体,修改第一个双引号里的内容即可 }; observerProtyleUtil((util)=>{ const isMemo = util.querySelector('.fn__flex-1.resize__move')?.textContent?.trim() === window.siyuan.languages.memo; if(!isMemo) return; const textarea = util.querySelector('textarea'); if(!textarea) return; Object.assign(textarea.style, styles); }); function observerProtyleUtil(callback) { let hasEmit = false; // 1. 创建 MutationObserver 实例 const observer = new MutationObserver((mutationsList) => { mutationsList.forEach((mutation) => { // 2. 获取目标元素 const targetElement = mutation.target; // 3. 检查目标元素是否是 .protyle .protyle-util if (targetElement.matches('.protyle .protyle-util')) { // 4. 检查 .fn__none 类是否被删除 if (!targetElement.classList.contains('fn__none')) { if(hasEmit) return; hasEmit = true; callback(targetElement); setTimeout(() => { hasEmit = false; }, 100); } } }); }); // 5. 配置并启动监听 observer.observe(document.querySelector('.layout__center, #editor')||document.body, { //childList: true, // 监控子节点的变化 attributes: true, // 监听属性变化 attributeFilter: ['class'], // 只监听 class 属性 subtree: true, // 监听所有后代元素 }); } }
只需要修改 styles 参数里的样式即可。
1 回复 - 其他回帖
-
-
搞定了,感谢哈。是我复制代码错了。我是用鼠标去选的文本。 没看到右上角有一个代码复制的按钮。
这个备注修改颜色的功能,也不是我想要的。我以为是能够把不同的文字修改不同的颜色呢。至少两种颜色吧,非重点是白的,重点的是红色。 能实现这种功能吗?❤️ - 查看全部回帖