Hue Hint (Browser Injection)

.js

javascript:(()=>{if(document.getElementById('kw-highlighter-box'))return;const e=document.createElement("div");e.id="kw-highlighter-box",e.style="position:fixed;top:20px;right:20px;z-index:9999;background:#fff;border:1px solid #ccc;padding:10px;border-radius:8px;box-shadow:0 2px 6px rgba(0,0,0,0.2);font-family:sans-serif;width:600px;opacity:0;transform:scale(0.98);transition:opacity 0.3s ease,transform 0.3s ease;",e.innerHTML='<div style="display:flex;justify-content:space-between;align-items:center;"><h4 style="margin:0">🔍 Hue Hint</h4><button id="kw-close" title="Close" style="border:none;background:none;font-size:18px;cursor:pointer;">×</button></div><div id="kw-fields" style="margin-top:10px;"></div><div style="display:flex;justify-content:space-between;align-items:center;margin-top:10px;"><div style="display:flex;gap:6px;"><button id="kw-add" title="Add a new field" style="font-size:16px;padding:4px 8px;width:36px;height:36px;color:#28a745;">+</button><button id="kw-remove" title="Remove last field" style="font-size:16px;padding:4px 8px;width:36px;height:36px;color:#dc3545;">−</button></div><div style="display:flex;gap:8px;transform:translateX(-38px);"><button id="kw-run" title="Highlight" style="font-size:16px;padding:4px 8px;width:36px;height:36px;">🎨</button><button id="kw-clear" title="Remove highlights" style="font-size:16px;padding:4px 8px;width:36px;height:36px;">❌</button></div></div>',document.body.appendChild(e);requestAnimationFrame(()=>{e.style.opacity="1",e.style.transform="scale(1)"});const t=document.getElementById("kw-fields");function n(){const e=document.createElement("div");e.style="margin-bottom:5px;display:flex;align-items:center;gap:10px;",e.innerHTML='<input type="text" placeholder="keywords (e.g., Zhan, Cat)" style="flex:1;padding:4px;" /><input type="color" value="#ffff00" style="width:28px;height:32px;border:none;padding:0;margin:0;" />',t.appendChild(e)}function o(){t.lastChild&&t.removeChild(t.lastChild)}function l(){document.querySelectorAll(".kw-hl").forEach(e=>{e.replaceWith(document.createTextNode(e.textContent))})}function d(){l();const e=Array.from(t.children).map(e=>{const[t,n]=e.querySelectorAll("input");return{keywords:t.value.split(",").map(e=>e.trim()).filter(Boolean),color:n.value}});!function t(n){3===n.nodeType?(()=>{let t=n.nodeValue,o=!1;e.forEach(({keywords:e,color:r})=>{const l=new RegExp("\\b("+e.join("|")+")\\b","gi");l.test(t)&&(t=t.replace(l,`<span class="kw-hl" style="background:${r}; padding:2px 5px; border-radius:6px; font-weight:bold; box-shadow:0 1px 2px rgba(0,0,0,0.15); display:inline-block;">$1</span>`),o=!0)}),o&&(()=>{const e=document.createElement("span");e.innerHTML=t,n.parentNode.replaceChild(e,n)})()})():1===n.nodeType&&n.childNodes&&!["SCRIPT","STYLE","NOSCRIPT"].includes(n.tagName)&&Array.from(n.childNodes).forEach(t)}(document.body)}document.getElementById("kw-add").onclick=n,document.getElementById("kw-remove").onclick=o,document.getElementById("kw-close").onclick=()=>{e.style.opacity="0",e.style.transform="scale(0.98)",setTimeout(()=>e.remove(),300)},document.getElementById("kw-run").onclick=d,document.getElementById("kw-clear").onclick=l,n()})();