-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathdevtools.min.js.bak
More file actions
1 lines (1 loc) · 5.78 KB
/
devtools.min.js.bak
File metadata and controls
1 lines (1 loc) · 5.78 KB
1
javascript:(function(){if(window.__devToolsInjected)return;window.__devToolsInjected=!0;function getContrast(e,t){const r=(e=>{const t=parseInt(e.slice(1,3),16)/255,n=parseInt(e.slice(3,5),16)/255,o=parseInt(e.slice(5,7),16)/255,l=[t,n,o].map((e=>e<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4)));return.2126*l[0]+.7152*l[1]+.0722*l[2]})(e),n=(e=>{const t=parseInt(e.slice(1,3),16)/255,n=parseInt(e.slice(3,5),16)/255,o=parseInt(e.slice(5,7),16)/255,l=[t,n,o].map((e=>e<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4)));return.2126*l[0]+.7152*l[1]+.0722*l[2]})(t);return(r+0.05)/(n+0.05)}function checkContrast(el){const style=window.getComputedStyle(el),fg=style.color,bg=style.backgroundColor,[c1,c2]=[fg,bg].map(c=>{const rgb=c.match(/\d+/g).map(Number);return"#"+rgb.slice(0,3).map(v=>v.toString(16).padStart(2,"0")).join("")});if(c1&&c2){const cr=getContrast(c1,c2);cr<4.5&&console.warn("❗ Low contrast:",el,"CR:",cr.toFixed(2),c1,"on",c2)}}const style=document.createElement("style");style.textContent=`.dev-toolbar{position:fixed;bottom:0;left:0;right:0;z-index:99999;background:rgba(0,0,0,0.85);color:white;padding:6px 10px;font-family:sans-serif;font-size:14px;display:flex;gap:1rem;align-items:center;transition:transform 0.4s ease}.dev-toolbar.hidden{transform:translateY(100%)}.dev-toolbar label{display:flex;align-items:center;gap:4px}.dev-toolbar button{background:none;border:1px solid white;color:white;padding:2px 6px;border-radius:4px;cursor:pointer}.dev-toolbar button:hover{background:rgba(255,255,255,0.1)}.dev-toolbar input[type="checkbox"]{box-sizing:border-box;width:18px;height:18px;margin:3px 7px 0 0;padding:0;border:1px solid white;appearance:none;background-color:transparent;outline:none;transition:outline 0.1s}.dev-toolbar input[type="checkbox"]:checked{background-size:50%;background-repeat:no-repeat;background-position:center;padding:2px;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 32 32" xml:space="preserve"><path style="fill:%23FFF" d="M11.941,28.877l-11.941-11.942l5.695-5.696l6.246,6.246l14.364-14.364L32,8.818"/></svg>')}.dev-toolbar label:has([disabled]){opacity:0.55}.dev-grid{width:100%;height:100%;position:fixed;top:0;left:0;pointer-events:none;z-index:999;opacity:.8}.dev-grid [class^="container"],.dev-grid .row{height:100%}.dev-column{background:rgba(21,198,36,0.108);position:relative}.dev-column::after,.dev-column::before{width:16px;height:100%;content:"";display:block;position:absolute;top:0;background:rgba(21,198,36,0.108)}.dev-column::before{left:0;border-left:1px solid rgba(0,138,12,0.1)}.dev-column::after{right:0;border-right:1px solid rgba(0,138,12,0.1)}`,document.head.appendChild(style);const toolbar=document.createElement("div");toolbar.className="dev-toolbar",toolbar.innerHTML='<label><input type="checkbox" id="toggleGrid"> Grid</label><label><input type="checkbox" id="toggleFluid" disabled> Container Fluid</label><label><input type="checkbox" id="toggleOutlines"> Outlines</label><button id="clearStorage">Clear Storage</button><button id="a11yCheck">Accessibility Helpers</button>',document.body.appendChild(toolbar);const grid=document.createElement("div");grid.className="dev-grid",grid.style.display="none",grid.innerHTML='<div class="container"><div class="row">'+Array.from({length:12}).map(()=>'<div class="col dev-column"></div>').join("")+"</div></div>",document.body.appendChild(grid);const set=(k,v)=>localStorage.setItem(k,v),get=k=>"true"===localStorage.getItem(k),elG=document.getElementById("toggleGrid"),elO=document.getElementById("toggleOutlines"),elF=document.getElementById("toggleFluid"),container=grid.firstElementChild;function detectOverflows(){const w=document.body.offsetWidth;document.querySelectorAll("body *").forEach(el=>{el.getBoundingClientRect().right>w&&console.warn("Overflowing element →",el)})}elG.addEventListener("change",e=>{const on=e.target.checked;grid.style.display=on?"block":"none",elF.disabled=!on,set("devGrid",on)}),elO.addEventListener("change",e=>{const on=e.target.checked;document.body.classList.toggle("dev-column-outline",on),set("devOutlines",on),on&&detectOverflows()}),elF.addEventListener("change",e=>{const on=e.target.checked;container.classList.toggle("container-fluid",on),container.classList.toggle("container",!on),set("devFluid",on)}),document.getElementById("clearStorage").addEventListener("click",()=>{localStorage.clear(),alert("localStorage cleared")}),document.getElementById("a11yCheck").addEventListener("click",()=>{console.log("🔍 Accessibility Helpers");let last=0;document.querySelectorAll("h1,h2,h3,h4,h5,h6").forEach(h=>{const lvl=parseInt(h.tagName[1]);console.log(`Heading: <${h.tagName.toLowerCase()}> – ${h.textContent.trim()}`),lvl-last>1&&last>0&&console.warn("⚠️ Skipped heading level!"),last=lvl}),document.querySelectorAll("[role]").forEach(el=>{console.log(`ARIA role: <${el.tagName.toLowerCase()}> [role="${el.getAttribute("role")}"]`)}),document.querySelectorAll("img").forEach(el=>{const alt=el.getAttribute("alt");alt?console.log("🖼️ IMG alt:",alt):console.warn("❌ Missing alt for image:",el)}),document.querySelectorAll("body *").forEach(el=>{if(typeof el.innerText==="string" && el.innerText.trim()) checkContrast(el)})});get("devGrid")&&(elG.checked=!0,grid.style.display="block",elF.disabled=!1),get("devOutlines")&&(elO.checked=!0,document.body.classList.add("dev-column-outline"),detectOverflows()),get("devFluid")&&(elF.checked=!0,container.classList.remove("container"),container.classList.add("container-fluid"));let scrollY=window.pageYOffset,lock=!1;window.addEventListener("scroll",()=>{lock||(requestAnimationFrame(()=>{Math.abs(window.pageYOffset-scrollY)<5||(window.pageYOffset>scrollY?toolbar.classList.add("hidden"):toolbar.classList.remove("hidden"),scrollY=window.pageYOffset,lock=!1)}),lock=!0)})})();