mirror of
https://github.com/picocss/pico.git
synced 2025-04-20 16:46:14 -04:00
1 line
No EOL
6.2 KiB
JavaScript
1 line
No EOL
6.2 KiB
JavaScript
!function(){function e(e){if("light"==e)var t=r.button.on;else t=r.button.off;document.querySelector("html").setAttribute("data-theme",e),document.querySelector(r.selector).innerHTML=t,document.querySelector(r.selector).setAttribute("aria-label",t.replace(/<[^>]*>?/gm,"")),r.currentTheme=e}var t,r={button:{element:"BUTTON",class:"secondary switcher",on:"<i>Turn on dark mode</i>",off:"<i>Turn off dark mode</i>"},target:"main",selector:"button.switcher",currentTheme:window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"};(t=document.createElement(r.button.element)).className=r.button.class,document.querySelector(r.target).after(t),e(r.currentTheme),document.querySelector(r.selector).addEventListener("click",function(){"light"==r.currentTheme?e("dark"):e("light")},!1)}(),function(){function r(e){event.preventDefault();var t,r,o=e.href.split("#");o=function(e){mobile=window.matchMedia("(max-width: 991.99px)"),mobile.matches||"docs"==e&&(e="start");return e}(o[1]),o=document.getElementById(o),r=o,t=Math.floor(r.getBoundingClientRect().top),window.scrollBy({top:t,left:0,behavior:"smooth"})}!function(e){for(var t=0;t<e.length;t++)-1!=e[t].href.indexOf("#")&&e[t].addEventListener("click",function(e){r(e.target)},!1)}(document.querySelectorAll('a:not([href^="https://picocss.com"])'))}(),function(){function e(e){for(var t="",r="",o=0;o<e;o++)t+="<div>"+(o+1)+"</div>",r+=" <<b>div</b>>"+(o+1)+"</<b>div</b>>\n";document.querySelector(n.targetGrid).innerHTML=t,document.querySelector(n.targetCode).innerHTML='<<b>section</b> <i>class</i>=<u>"grid"</u>>\n'+r+"</<b>section</b>>"}var t,n={columnsCurrent:4,columnsMin:1,columnsMax:12,targetButtons:"#grids article",targetGrid:"#grids .grid",targetCode:"#grids pre code",selectorAdd:"#grids button.add",selectorRemove:"#grids button.remove"};(t=document.createElement("P")).innerHTML='<button class="secondary add"><svg xmlns="http://www.w3.org/2000/svg" height="1rem" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg> Add column</button><button class="secondary remove"><svg xmlns="http://www.w3.org/2000/svg" height="1rem" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"></line></svg> Remove column</button>',document.querySelector(n.targetButtons).before(t),document.querySelector(n.selectorAdd).addEventListener("click",function(){n.columnsCurrent<n.columnsMax&&(n.columnsCurrent++,e(n.columnsCurrent))},!1),document.querySelector(n.selectorRemove).addEventListener("click",function(){n.columnsCurrent>n.columnsMin&&(n.columnsCurrent--,e(n.columnsCurrent))},!1)}(),function(){function i(e,t){!function(e,t){for(var r=document.querySelectorAll(g.selectorTheme+" .name"),o=0;o<r.length;++o)r[o].innerHTML=e.charAt(0).toUpperCase()+e.substring(1)+" ";for(var n=document.querySelectorAll(g.selectorTheme+" .c500"),o=0;o<n.length;++o)n[o].innerHTML=t[500];for(var c=document.querySelectorAll(g.selectorTheme+" .c600"),o=0;o<c.length;++o)c[o].innerHTML=t[600];for(var l=document.querySelectorAll(g.selectorTheme+" .c700"),o=0;o<l.length;++o)l[o].innerHTML=t[700];for(var a=document.querySelectorAll(g.selectorTheme+" .c600-outline-light"),o=0;o<a.length;++o)a[o].innerHTML=h(t[600],.125);for(var i=document.querySelectorAll(g.selectorTheme+" .c600-outline-dark"),o=0;o<i.length;++o)i[o].innerHTML=h(t[600],.25);for(var u=document.querySelectorAll(g.selectorTheme+" .inverse"),o=0;o<u.length;++o)u[o].innerHTML=t.inverse;var s='[data-theme="generated"] {--primary:'+t[600]+";--h4:"+t[700]+";--primary-hover:"+t[700]+";--primary-focus:"+h(t[600],.125)+";--primary-inverse:"+t.inverse+';}@media only screen and (prefers-color-scheme: dark) {:root:not([data-theme="light"]) [data-theme="generated"] {--primary:'+t[600]+";--h4:"+t[300]+";--primary-hover:"+t[500]+";--primary-focus:"+h(t[600],.25)+";--primary-inverse:"+t.inverse+';}}[data-theme="dark"] [data-theme="generated"] {--primary:'+t[600]+";--h4:"+t[300]+";--primary-hover:"+t[500]+";--primary-focus:"+h(t[600],.25)+";--primary-inverse:"+t.inverse+";}",d=document.querySelector('style:not([title="color-picker"])');if(void 0!==d&&null!=d)d.innerHTML=s;else{var m=document.createElement("STYLE");m.innerHTML=s,document.querySelector("head link").after(m)}document.querySelector(g.selectorTheme+" .grid").setAttribute("data-theme",e)}(e,t);for(var r=document.querySelectorAll(g.selectorButton),o=0;o<r.length;o++)r[o].removeAttribute("class");document.querySelector(g.selectorButton+'[data-color="'+e+'"]').setAttribute("class","picked")}function h(e,t){var r;if(/^#([A-Fa-f0-9]{3}){1,2}$/.test(e))return 3==(r=e.substring(1).split("")).length&&(r=[r[0],r[0],r[1],r[1],r[2],r[2]]),"rgba("+[(r="0x"+r.join(""))>>16&255,r>>8&255,255&r].join(",")+","+t+")";throw new Error("Bad Hex")}var e,t,r,g={list:"json/material-colors.json",target:"#customization h5",selectorButton:"#customization button[data-color]",selectorTheme:"#customization"};e=g.list,t=function(e){!function(t){var e="",r="";for(var o in t)t.hasOwnProperty(o)&&(e+='<button data-color="'+o+'"></button>',r+='button[data-color="'+o+'"] {background-color: '+t[o][600]+'; }[data-theme="light"] button[data-color="'+o+'"]:hover, [data-theme="light"] button[data-color="'+o+'"]:active, [data-theme="light"] button[data-color="'+o+'"]:focus {background-color: '+t[o][700]+'; }[data-theme="dark"] button[data-color="'+o+'"]:hover, [data-theme="dark"] button[data-color="'+o+'"]:active, [data-theme="dark"] button[data-color="'+o+'"]:focus {background-color: '+t[o][500]+"; }");var n=document.createElement("FIGURE");n.innerHTML=e,document.querySelector(g.target).after(n);for(var c=document.querySelectorAll(g.selectorButton),l=0;l<c.length;l++)c[l].addEventListener("click",function(e){buttonColor=e.target.getAttribute("data-color"),i(buttonColor,t[buttonColor])},!1);var a=document.createElement("STYLE");a.setAttribute("title","color-picker"),a.innerHTML=r,document.querySelector("head link").after(a)}(e),i("pink",e.pink)},(r=new XMLHttpRequest).open("GET",e,!0),r.onload=function(){if(!(200<=r.status&&r.status<400))return"error";var e=JSON.parse(r.responseText);t(e)},r.onerror=function(){return"error"},r.send()}(); |