🏠 Home　

Style for Coze Bot App mode

Make Coze Bot looks better!


安装此脚本? 
  1. // ==UserScript==
  2. // @name         Style for Coze Bot App mode
  3. // @namespace    https://www.velhlkj.com/
  4. // @version      1.1.5
  5. // @description  Make Coze Bot looks better!
  6. // @author       Velade
  7. // @match        https://www.coze.com/store/bot/*
  8. // @icon         data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
  9. // @grant        none
  10. // @run-at       document-body
  11. // @license      Apache 2.0
  12. // ==/UserScript==
  13. (function() {
  14. 'use strict';
  15. const style = document.createElement('style');
  16. style.textContent = `
  17. /*官方阴影*/
  18. .ULoOs2TMkJkb2BgT_MKa {
  19. display: none !important;
  20. }
  21. /*新对话按钮*/
  22. .NyvVfPwFXFYvQFyXUtTl {
  23. padding-left: 0 !important;
  24. }
  25. /*标题列*/
  26. .nZxnu8KzOis7qKnDx66E {
  27. position: fixed !important;
  28. top: 5px !important;
  29. right: 5px !important;
  30. width: 80px !important;
  31. height: 40px !important;
  32. filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.5)) !important;
  33. }
  34. .nZxnu8KzOis7qKnDx66E > div:first-child {
  35. display: none !important;
  36. }
  37. .nZxnu8KzOis7qKnDx66E > div:nth-child(2) > div:nth-child(2){
  38. display: none !important;
  39. }
  40. /*对话区域主体*/
  41. .O4fwdEnt3QgzBjrYtohO {
  42. -webkit-mask: linear-gradient(180deg,hsla(0,0%,100%,0) 5px, #fff calc(8.11% + 5px), #fff 91.89%, hsla(0,0%,100%,0)) !important;
  43. mask: linear-gradient(180deg,hsla(0,0%,100%,0) 5px, #fff calc(8.11% + 5px), #fff 91.89%, hsla(0,0%,100%,0)) !important;
  44. }
  45. /*底部声明：改为导航栏占位*/
  46. .pStAbHgTdAlDVUlpMOGP {
  47. opacity: 0 !important;
  48. height: 5px !important;
  49. }
  50. .pStAbHgTdAlDVUlpMOGP > span {
  51. display: none;
  52. }
  53. /*斜体样式*/
  54. .flow-markdown-body em.proced{
  55. display: none !important;
  56. }
  57. .flow-markdown-body em.vel-em-action {
  58. display: block !important;
  59. clear: both !important;
  60. color: #FF69B4 !important;
  61. font-style: normal !important;
  62. }
  63. .flow-markdown-body em.vel-em-other {
  64. display: inline-block !important;
  65. clear: none !important;
  66. color: #FF69B4 !important;
  67. font-style: normal !important;
  68. }
  69. `;
  70. document.head.appendChild(style);
  71. let pendingNodes = new Array();
  72. let timer = null;
  73. let observer = new MutationObserver(mutations=>{
  74. mutations.forEach(mutation=>{
  75. if(mutation.type === 'childList' || mutation.type === "characterData"){
  76. let newPush = false;
  77. mutation.addedNodes.forEach((node)=>{
  78. if(node.matches && (node.matches(".vel-em-action") || node.matches(".vel-em-other"))) return;
  79. pendingNodes.push(node);
  80. newPush = true;
  81. })
  82. if(newPush) PostProc();
  83. }
  84. })
  85. });
  86. // 获取textnode
  87. function getTextNodes(ele) {
  88. if (ele.nodeType == 3) return [ele];
  89. const nodes = ele.childNodes;
  90. const textnodes = [];
  91. for (const i in nodes) {
  92. if (nodes[i].nodeType == 3) {
  93. textnodes.push(nodes[i]);
  94. } else {
  95. const r = getTextNodes(nodes[i]);
  96. for (const tn of r) {
  97. textnodes.push(tn);
  98. }
  99. }
  100. }
  101. return textnodes;
  102. }
  103. // 后处理
  104. function PostProc(delay = 50) {
  105. if(timer) clearTimeout(timer);
  106. timer = setTimeout(()=>{
  107. const _pendingNodes = [...new Set(pendingNodes)];
  108. let node;
  109. while(node = _pendingNodes.shift()) {
  110. if(!node.querySelectorAll) continue;
  111. if(node.textContent.match(/\*\([^\)]+?\)\*/)) {
  112. const nl = getTextNodes(node);
  113. for(const n of nl) {
  114. if(n.nodeValue.match(/\*\([^\)]+?\)\*/)){
  115. const newNode = document.createElement("span");
  116. newNode.innerHTML = n.nodeValue.replaceAll(/\*\(([^\)]+?)\)\*/g, `<em class="vel-em-action">$1</em>`);
  117. n.replaceWith(newNode);
  118. }
  119. }
  120. }else if(node.tagName.toLowerCase() == "em") {
  121. if(node.matches(".proced") || node.matches(".vel-em-action") || node.matches(".vel-em-other")) continue;
  122. if(node.textContent.match(/^[\(（].+?[\)）]$/)) {
  123. const em = document.createElement("em");
  124. em.textContent = node.textContent.replaceAll(/[\(\)（）]/g,"");
  125. em.classList.add("vel-em-action");
  126. node.classList.add("proced");
  127. node.after(em);
  128. }
  129. else node.classList.add("vel-em-other");
  130. }else if(node.matches(".math-inline")){
  131. if(node.parentElement.querySelector(".vel-em-action")) continue;
  132. const em = document.createElement("em");
  133. em.textContent = node.textContent.replaceAll(/[\(\)（）]/g,"");
  134. em.classList.add("vel-em-action");
  135. node.parentElement.classList.remove("vel-em-other");
  136. node.parentElement.classList.add("proced");
  137. node.parentElement.after(em);
  138. }else{
  139. node.querySelectorAll(`em:not(.vel-em-action, .vel-em-other)`).forEach(n=>{
  140. if(n.textContent.match(/^[\(（].+?[\)）]$/)) {
  141. if(n.parentElement.querySelector(".vel-em-action")) return;
  142. const em = document.createElement("em");
  143. em.textContent = n.textContent.replaceAll(/[\(\)（）]/g,"");
  144. em.classList.add("vel-em-action");
  145. n.classList.add("proced");
  146. n.after(em);
  147. }
  148. else n.classList.add("vel-em-other");
  149. })
  150. }
  151. }
  152. }, delay);
  153. }
  154. const config = { childList: true, subtree: true,characterData: true };
  155. const targetNode = document.body;
  156. observer.observe(targetNode, config);
  157. })();