toolness 2021-04-13 19:42:27 +00:00
rodzic abc997f362
commit 8fb3bdfbf2
4 zmienionych plików z 5 dodań i 5 usunięć

File diff suppressed because one or more lines are too long

Wyświetl plik

@ -56,7 +56,7 @@ var e;!function(){"use strict";var t={}.hasOwnProperty;function r(){for(var e=[]
},{"react":"HdMw"}],"PhPL":[function(require,module,exports) {
"use strict";var e=this&&this.__createBinding||(Object.create?function(e,t,a,l){void 0===l&&(l=a),Object.defineProperty(e,l,{enumerable:!0,get:function(){return t[a]}})}:function(e,t,a,l){void 0===l&&(l=a),e[l]=t[a]}),t=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),a=this&&this.__importStar||function(a){if(a&&a.__esModule)return a;var l={};if(null!=a)for(var r in a)"default"!==r&&Object.prototype.hasOwnProperty.call(a,r)&&e(l,a,r);return t(l,a),l};Object.defineProperty(exports,"__esModule",{value:!0}),exports.VocabularyPage=void 0;const l=a(require("react")),r=require("../bounding-box"),n=require("../svg-symbol"),o=require("../svg-vocabulary"),c=require("../symbol-context-widget"),i=require("../hover-debug-helper"),u=require("../page"),d=e=>"".concat(e,"px"),s=100,b=e=>{const t=e.data,a=r.dilateBoundingBox(t.bbox,100),o=e.scale||1,[c,i]=r.getBoundingBoxSize(a);return l.default.createElement("svg",{viewBox:"".concat(a.x.min," ").concat(a.y.min," ").concat(c," ").concat(i),width:d(c*o),height:d(i*o)},l.default.createElement(n.SvgSymbolContent,Object.assign({},e)))},m=()=>{const[e,t]=l.useState(n.createSvgSymbolContext()),[a,r]=l.useState(""),d=a.toLowerCase().replace(/ /g,"_"),s=l.useMemo(()=>o.SvgVocabulary.items.filter(e=>e.name.toLowerCase().includes(d)),[d]);return l.default.createElement(u.Page,{title:"Vocabulary!"},l.default.createElement("div",{className:"sidebar"},l.default.createElement("div",{className:"flex-widget"},l.default.createElement("label",{htmlFor:"filter"},"Search for symbols: "),l.default.createElement("input",{type:"text",id:"filter",value:a,onChange:e=>r(e.target.value),placeholder:"🔎"})),l.default.createElement(c.SymbolContextWidget,{ctx:e,onChange:t})),l.default.createElement("div",{className:"canvas scrollable"},l.default.createElement(i.HoverDebugHelper,null,s.map(t=>l.default.createElement("div",{key:t.name,style:{display:"inline-block",border:"1px solid black",margin:"4px"}},l.default.createElement("div",{style:{backgroundColor:"black",color:"white",padding:"4px"}},t.name),l.default.createElement("div",{className:"checkerboard-bg",style:{lineHeight:0}},l.default.createElement(b,Object.assign({data:t,scale:.25},e))))))))};exports.VocabularyPage=m;
},{"react":"HdMw","../bounding-box":"nblm","../svg-symbol":"ObB7","../svg-vocabulary":"iXyu","../symbol-context-widget":"ZUAZ","../hover-debug-helper":"OjlT","../page":"RJck"}],"M5sl":[function(require,module,exports) {
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Random=void 0;const e=require("./util"),t={modulus:Math.pow(2,32),multiplier:1664525,increment:1013904223};class s{constructor(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:Date.now(),s=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t;this.seed=e,this.params=s,this.latestSeed=e}clone(){return new s(this.latestSeed,this.params)}next(){return this.latestSeed=(this.params.multiplier*this.latestSeed+this.params.increment)%this.params.modulus,this.latestSeed/this.params.modulus}bool(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:.5;return this.next()<e}inRange(t){return this.choice(e.inclusiveRange(t))}choice(e){if(0===e.length)throw new Error("Cannot choose randomly from an empty array!");return e[Math.floor(this.next()*e.length)]}uniqueChoices(e,t){let s=[...e];const r=[];for(let i=0;i<t&&0!==s.length;i++){const e=this.choice(s);s=s.filter(t=>t!==e),r.push(e)}return r}}exports.Random=s;
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Random=void 0;const e=require("./util"),t={modulus:Math.pow(2,32),multiplier:1664525,increment:1013904223};class s{constructor(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:Date.now(),s=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t;this.seed=e,this.params=s,this.latestSeed=e}clone(){return new s(this.latestSeed,this.params)}next(){return this.latestSeed=(this.params.multiplier*this.latestSeed+this.params.increment)%this.params.modulus,this.latestSeed/this.params.modulus}bool(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:.5;return this.next()<e}inRange(t){return this.choice(e.inclusiveRange(t))}inInterval(e){let{min:t,max:s}=e;return this.next()*(s-t)+t}choice(e){if(0===e.length)throw new Error("Cannot choose randomly from an empty array!");return e[Math.floor(this.next()*e.length)]}uniqueChoices(e,t){let s=[...e];const r=[];for(let n=0;n<t&&0!==s.length;n++){const e=this.choice(s);s=s.filter(t=>t!==e),r.push(e)}return r}}exports.Random=s;
},{"./util":"sxvS"}],"kXMH":[function(require,module,exports) {
"use strict";var t=this&&this.__createBinding||(Object.create?function(t,e,n,r){void 0===r&&(r=n),Object.defineProperty(t,r,{enumerable:!0,get:function(){return e[n]}})}:function(t,e,n,r){void 0===r&&(r=n),t[r]=e[n]}),e=this&&this.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),n=this&&this.__importStar||function(n){if(n&&n.__esModule)return n;var r={};if(null!=n)for(var i in n)"default"!==i&&Object.prototype.hasOwnProperty.call(n,i)&&t(r,n,i);return e(r,n),r};Object.defineProperty(exports,"__esModule",{value:!0}),exports.SvgWithBackground=exports.getSvgMetadata=exports.AutoSizingSvg=void 0;const r=n(require("react"));function i(t){r.useEffect(()=>(window.addEventListener("resize",t),()=>{window.removeEventListener("resize",t)}))}function o(t){var e;let n=void 0;const r=t.querySelector("[data-is-background]");r&&(n=null!==(e=r.getAttribute("fill"))&&void 0!==e?e:void 0);const{x:i,y:o,width:c,height:a}=t.viewBox.baseVal;return{x:i,y:o,width:c,height:a,bgColor:n}}exports.AutoSizingSvg=r.default.forwardRef((t,e)=>{const{bgColor:n,sizeToElement:o}=t,[c,a]=r.useState(0),[u,d]=r.useState(0),[l,s]=r.useState(1),[h,g]=r.useState(1),f=r.useRef(null),v=()=>{if(null==o?void 0:o.current){const t=o.current.getBoundingClientRect();return a(-t.width/2),d(-t.height/2),s(t.width),g(t.height),!0}return!1};return i(v),r.useEffect(()=>{if(!v()){const e=f.current;if(e){const n=e.getBBox(),r=t.padding||0;a(n.x-r),d(n.y-r),s(n.width+2*r),g(n.height+2*r)}}}),r.default.createElement("svg",{version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"".concat(l,"px"),height:"".concat(h,"px"),viewBox:"".concat(c," ").concat(u," ").concat(l," ").concat(h),ref:e},n&&r.default.createElement("rect",{x:c,y:u,width:l,height:h,fill:n,"data-is-background":!0}),r.default.createElement("g",{ref:f},t.children))}),exports.getSvgMetadata=o;const c=t=>{let{x:e,y:n,width:i,height:o,bgColor:c,children:a}=t;return r.default.createElement("svg",{version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"".concat(i,"px"),height:"".concat(o,"px"),viewBox:"".concat(e," ").concat(n," ").concat(i," ").concat(o)},c&&r.default.createElement("rect",{x:e,y:n,width:i,height:o,fill:c,"data-is-background":!0}),a)};exports.SvgWithBackground=c;
},{"react":"HdMw"}],"wi82":[function(require,module,exports) {
@ -84,7 +84,7 @@ var e,t=arguments[3];!function(n){if("object"==typeof exports&&"undefined"!=type
},{"react":"HdMw","./color-widget":"ct9k","./colors":"jKHh","./svg-symbol":"ObB7","./symbol-context-widget":"ZUAZ"}],"srbU":[function(require,module,exports) {
!function(){var n=function(n,r){for(var t=0,u=I(0,n.length-1,!0),e=0;e<u.length;e++){var o=u[e];t+=n[o]*r[o]}return t},r=function(n,r){var t=Math.pow(10,r);return Math.round(n*t)/t},t=function(n,t){for(var u=I(0,(n=n.map(function(n){return r(n,3)})).length-1,!0),e=0;e<u.length;e++){var o=u[e];if(n[o]<t[o][0]||n[o]>t[o][1])return!1}return!0},u=function(n){return n>.008856?Math.pow(n,1/3):7.787*n+16/116},e=function(n){return Math.pow(n,3)>.008856?Math.pow(n,3):(116*n-16)/903.3},o={CIEXYZ:{},CIExyY:{},CIELAB:{},CIELCH:{},CIELUV:{},CIELCHuv:{},sRGB:{},hex:{}};o.CIEXYZ.sRGB=function(r){var t=[[3.2406,-1.5372,-.4986],[-.9689,1.8758,.0415],[.0557,-.204,1.057]],u=function(n){return n<=.0031308?12.92*n:1.055*Math.pow(n,1/2.4)-.055};return[u(n(t[0],r)),u(n(t[1],r)),u(n(t[2],r))]},o.sRGB.CIEXYZ=function(r){var t=r[0],u=r[1],e=r[2],o=function(n){return n>.04045?Math.pow((n+.055)/1.055,2.4):n/12.92},a=[[.4124,.3576,.1805],[.2126,.7152,.0722],[.0193,.1192,.9505]],i=[o(t),o(u),o(e)];return[n(a[0],i),n(a[1],i),n(a[2],i)]},o.CIEXYZ.CIExyY=function(n){var r=n[0],t=n[1],u=r+t+n[2];return 0===u?[0,0,t]:[r/u,t/u,t]},o.CIExyY.CIEXYZ=function(n){var r=n[0],t=n[1],u=n[2];return 0===t?[0,0,0]:[r*u/t,u,(1-r-t)*u/t]},o.CIEXYZ.CIELAB=function(n){var r=n[0],t=n[1],e=n[2],o=u(r/.95047),a=u(t/1);return[116*a-16,500*(o-a),200*(a-u(e/1.08883))]},o.CIELAB.CIEXYZ=function(n){var r=n[0],t=n[1],u=(r+16)/116,o=u-n[2]/200;return[.95047*e(t/500+u),1*e(u),1.08883*e(o)]},o.CIEXYZ.CIELUV=function(n){var r=n[0],t=n[1],e=n[2],o=4*r/(r+15*t+3*e),a=9*t/(r+15*t+3*e),i=116*u(t/1)-16;return 0===i?[0,0,0]:[i,13*i*(o-3.80188/19.21696),13*i*(a-9/19.21696)]},o.CIELUV.CIEXYZ=function(n){var r=n[0],t=n[1],u=n[2];if(0===r)return[0,0,0];var o=t/(13*r)+3.80188/19.21696,a=u/(13*r)+9/19.21696,i=1*e((r+16)/116),f=0-9*i*o/((o-4)*a-o*a);return[f,i,(9*i-15*a*i-a*f)/(3*a)]};var a=function(n){var r=n[0],t=n[1],u=n[2],e=Math.pow(Math.pow(t,2)+Math.pow(u,2),.5),o=360*Math.atan2(u,t)/2/Math.PI;return o<0&&(o=360+o),[r,e,o]};o.CIELAB.CIELCH=a,o.CIELUV.CIELCHuv=a;var i=function(n){var r=n[0],t=n[1],u=n[2]/360*2*Math.PI;return[r,Math.cos(u)*t,Math.sin(u)*t]};o.CIELCH.CIELAB=i,o.CIELCHuv.CIELUV=i;var f=function(n){n=n.map(function(n){return r(n,3)});for(var t=0;t<n.length;t++){var u=n[t];if(u<0||u>1)throw new Error("Illegal sRGB value")}return n.map(function(n){return Math.round(255*n)})};o.sRGB.hex=function(n){var r="#";n=f(n);for(var t=0;t<n.length;t++){var u=n[t];1===(u=u.toString(16)).length&&(u="0"+u),r+=u}return r},o.hex.sRGB=function(n){return"#"===n.charAt(0)&&(n=n.substring(1,7)),[n.substring(0,2),n.substring(2,4),n.substring(4,6)].map(function(n){return parseInt(n,16)/255})};var c,C=function(n,r){return function n(r,t,u){if(t===u)return function(n){return n};var e=r[0][0],a=r[0][1];if(t===e){var i=n(r.slice(1),a,u);return function(n){return i(o[e][a](n))}}if(u===e){var i=n(r.slice(1),t,a);return function(n){return o[a][e](i(n))}}return i=n(r.slice(1),t,u)}([["CIELCH","CIELAB"],["CIELCHuv","CIELUV"],["hex","sRGB"],["CIExyY","CIEXYZ"],["CIELAB","CIEXYZ"],["CIELUV","CIEXYZ"],["sRGB","CIEXYZ"]],n,r)},v={};try{c=require("stylus"),v=function(){var n=Object.keys(o).filter(function(n){return"sRGB"!==n&&"hex"!==n}).map(function(n){return n});return function(r){return n.map(function(n){return r.define(n,function(n){return function(r,t,u){var e=C(n,"sRGB"),o=f(e([r.val,t.val,u.val]));return new c.nodes.RGBA(o[0],o[1],o[2],1)}}(n))})}}}catch(E){}function I(n,r,t){for(var u=[],e=n<r,o=t?e?r+1:r-1:r,a=n;e?a<o:a>o;e?a++:a--)u.push(a);return u}v.converter=C,v.make_color=function(n,r){return{as:function(t){return C(n,t)(r)},is_displayable:function(){var u=C(n,"sRGB")(r);return t(u,[[0,1],[0,1],[0,1]])},is_visible:function(){var u=C(n,"CIEXYZ")(r);return t(u,[[0,.95047],[0,1],[0,1.08883]])}}},"undefined"!=typeof module&&null!==module&&(module.exports=v),"undefined"!=typeof jQuery&&null!==jQuery&&(jQuery.colorspaces=v)}();
},{}],"Enm9":[function(require,module,exports) {
"use strict";var e=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n),Object.defineProperty(e,r,{enumerable:!0,get:function(){return t[n]}})}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),t=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),n=this&&this.__importStar||function(n){if(n&&n.__esModule)return n;var r={};if(null!=n)for(var o in n)"default"!==o&&Object.prototype.hasOwnProperty.call(n,o)&&e(r,n,o);return t(r,n),r};Object.defineProperty(exports,"__esModule",{value:!0}),exports.createRandomColorPalette=exports.clampedByteToHex=void 0;const r=require("./random"),o=require("./util"),a=n(require("colorspaces"));function i(e){e<0?e=0:e>255&&(e=255);let t=e.toString(16);return 1===t.length&&(t="0"+t),t}function l(e){let t=!0,n="#000000";for(let r=0;r<100;r++){let r=e.inRange({min:0,max:100,step:.1}),o=e.inRange({min:-134,max:220,step:.1}),i=e.inRange({min:-140,max:122,step:.1}),l=a.make_color("CIELUV",[r,o,i]);if(l.is_displayable()&&(0!=r||0==o&&0==i)){n=l.as("hex"),t=!1;break}}if(t){let t=[0,0,0].map(()=>e.inRange({min:0,max:255,step:1})/255);n=a.make_color("sRGB",t).as("hex")}return n}function u(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:new r.Random;return o.range(e).map(()=>l(t))}exports.clampedByteToHex=i,exports.createRandomColorPalette=u;
"use strict";var e=this&&this.__createBinding||(Object.create?function(e,t,r,n){void 0===n&&(n=r),Object.defineProperty(e,n,{enumerable:!0,get:function(){return t[r]}})}:function(e,t,r,n){void 0===n&&(n=r),e[n]=t[r]}),t=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),r=this&&this.__importStar||function(r){if(r&&r.__esModule)return r;var n={};if(null!=r)for(var o in r)"default"!==o&&Object.prototype.hasOwnProperty.call(r,o)&&e(n,r,o);return t(n,r),n};Object.defineProperty(exports,"__esModule",{value:!0}),exports.createRandomColorPalette=exports.clampedByteToHex=void 0;const n=require("./random"),o=require("./util"),a=r(require("colorspaces"));function i(e){e<0?e=0:e>255&&(e=255);let t=e.toString(16);return 1===t.length&&(t="0"+t),t}function l(e){let t=!0,r="#000000";for(let n=0;n<100;n++){let n=e.inInterval({min:0,max:100}),o=e.inInterval({min:-134,max:220}),i=e.inInterval({min:-140,max:122}),l=a.make_color("CIELUV",[n,o,i]);if(l.is_displayable()&&(0!=n||0==o&&0==i)){r=l.as("hex"),t=!1;break}}if(t){let t=[0,0,0].map(()=>e.inRange({min:0,max:255,step:1})/255);r=a.make_color("sRGB",t).as("hex")}return r}function u(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:new n.Random;return o.range(e).map(()=>l(t))}exports.clampedByteToHex=i,exports.createRandomColorPalette=u;
},{"./random":"M5sl","./util":"sxvS","colorspaces":"srbU"}],"rue3":[function(require,module,exports) {
"use strict";var e=this&&this.__createBinding||(Object.create?function(e,t,o,n){void 0===n&&(n=o),Object.defineProperty(e,n,{enumerable:!0,get:function(){return t[o]}})}:function(e,t,o,n){void 0===n&&(n=o),e[n]=t[o]}),t=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),o=this&&this.__importStar||function(o){if(o&&o.__esModule)return o;var n={};if(null!=o)for(var r in o)"default"!==r&&Object.prototype.hasOwnProperty.call(o,r)&&e(n,o,r);return t(n,o),n};Object.defineProperty(exports,"__esModule",{value:!0}),exports.RandomizerWidget=void 0;const n=o(require("react")),r=require("./random"),a=require("./random-colors");function l(){const[e,t,o]=a.createRandomColorPalette(3);return{background:e,stroke:t,fill:o}}const s=e=>{const[t,o]=n.useState("colors and symbols"),a=e=>n.default.createElement("label",{className:"checkbox"},n.default.createElement("input",{type:"radio",name:"randomize_type",value:e,checked:t===e,onChange:e=>o(e.target.value)})," ","Randomize ",e);return n.default.createElement("fieldset",null,n.default.createElement("legend",null,"Randomizer"),a("colors"),a("symbols"),a("colors and symbols"),n.default.createElement("button",{accessKey:"r",onClick:()=>{"colors"!==t&&"colors and symbols"!==t||e.onColorsChange(l()),"symbols"!==t&&"colors and symbols"!==t||e.onSymbolsChange(new r.Random(Date.now()))}},n.default.createElement("u",null,"R"),"andomize!"))};exports.RandomizerWidget=s;
},{"react":"HdMw","./random":"M5sl","./random-colors":"Enm9"}],"Wo33":[function(require,module,exports) {
@ -106,4 +106,4 @@ var e,t=arguments[3];!function(n){if("object"==typeof exports&&"undefined"!=type
},{"./waves-page":"R99w","./vocabulary-page":"PhPL","./creature-page":"Wo33","./mandala-page":"JWz6","./debug-page":"abWC"}],"qWv7":[function(require,module,exports) {
"use strict";var e=this&&this.__createBinding||(Object.create?function(e,t,r,n){void 0===n&&(n=r),Object.defineProperty(e,n,{enumerable:!0,get:function(){return t[r]}})}:function(e,t,r,n){void 0===n&&(n=r),e[n]=t[r]}),t=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),r=this&&this.__importStar||function(r){if(r&&r.__esModule)return r;var n={};if(null!=r)for(var a in r)"default"!==a&&Object.prototype.hasOwnProperty.call(r,a)&&e(n,r,a);return t(n,r),n},n=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});const a=r(require("react")),u=n(require("react-dom")),o=require("./page"),i=require("./pages"),c="app",l=document.getElementById("app");if(!l)throw new Error("Unable to find #".concat("app","!"));function s(){return new URLSearchParams(window.location.search)}function d(e){return a.useEffect(()=>(window.addEventListener("popstate",e),()=>{window.removeEventListener("popstate",e)}),[e]),function(t){window.history.pushState(null,"",t),e()}}const f=e=>{const[t,r]=a.useState(s()),n=i.toPageName(t.get(o.PAGE_QUERY_ARG)||"",i.DEFAULT_PAGE),u=i.Pages[n],c=d(()=>r(s())),l={currPage:n,allPages:i.pageNames,pushState:c};return a.default.createElement(o.PageContext.Provider,{value:l},a.default.createElement(u,null))};u.default.render(a.default.createElement(f,null),l);
},{"react":"HdMw","react-dom":"X9zx","./page":"RJck","./pages":"l8vw"}]},{},["qWv7"], null)
//# sourceMappingURL=browser-main.4015d3a7.js.map
//# sourceMappingURL=browser-main.f47bafba.js.map

File diff suppressed because one or more lines are too long

Wyświetl plik

@ -1 +1 @@
<!DOCTYPE html><meta charset="utf-8"><title>Mystic Symbolic</title><style>body,html{margin:0;padding:0;font-family:Calibri,Arial,Helvetica Neue,sans-serif;overflow:hidden}.page{display:grid;column-gap:8px;padding:8px;box-sizing:border-box;height:100vh;width:100vw;grid-template-columns:auto 20em;grid-template-rows:3em auto 3em;grid-template-areas:"header header" "canvas sidebar" "footer footer"}header{grid-area:header;display:flex}header h1{margin:0;flex-grow:1}.sidebar{grid-area:sidebar;overflow-y:auto}footer{grid-area:footer}input[type=text],select{padding:8px}.checkerboard-bg{background:#eee url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" fill-opacity=".1"><path d="M200 0h200v200H200zM0 200h200v200H0z"/></svg>');background-size:20px 20px}.hover-debug-helper{font-family:Consolas,Monaco,monospace;color:#fff;background:rgba(0,0,0,.75);padding:4px;margin-top:4px;margin-left:4px}.thingy{margin-top:10px;margin-bottom:10px}.thingy:first-child{margin-top:0}ul.navbar{display:flex;list-style-type:none;margin:0;padding:0;justify-content:flex-end}ul.navbar li{border-right:1px solid grey;margin-right:8px;padding-right:8px}ul.navbar li:last-child{border-right:none;padding-right:0;margin-right:0}.flex-widget{display:flex;flex-direction:column}.flex-widget label{margin-bottom:8px}.canvas{grid-area:canvas;display:flex;align-items:center;justify-content:center;overflow:hidden}.canvas.scrollable{display:block;overflow:auto}.sidebar .disabled{color:grey}.sidebar label.checkbox{display:block;margin-top:10px;margin-bottom:10px}.sidebar .color-widget{display:flex}.sidebar .color-widget label{flex-grow:1}.sidebar .numeric-slider{display:flex;flex-direction:column}.sidebar .numeric-slider .slider{display:flex}.sidebar .numeric-slider .slider input{flex-basis:90%}.overlay-wrapper{position:fixed;display:flex;background-color:rgba(0,0,0,.9);flex-direction:column;align-items:center;justify-content:center;color:#fff;top:0;left:0;bottom:0;right:0}</style><noscript> <p>Alas, you need JavaScript to peruse this page.</p> </noscript><div id="app" className="app"></div><script src="browser-main.4015d3a7.js"></script>
<!DOCTYPE html><meta charset="utf-8"><title>Mystic Symbolic</title><style>body,html{margin:0;padding:0;font-family:Calibri,Arial,Helvetica Neue,sans-serif;overflow:hidden}.page{display:grid;column-gap:8px;padding:8px;box-sizing:border-box;height:100vh;width:100vw;grid-template-columns:auto 20em;grid-template-rows:3em auto 3em;grid-template-areas:"header header" "canvas sidebar" "footer footer"}header{grid-area:header;display:flex}header h1{margin:0;flex-grow:1}.sidebar{grid-area:sidebar;overflow-y:auto}footer{grid-area:footer}input[type=text],select{padding:8px}.checkerboard-bg{background:#eee url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" fill-opacity=".1"><path d="M200 0h200v200H200zM0 200h200v200H0z"/></svg>');background-size:20px 20px}.hover-debug-helper{font-family:Consolas,Monaco,monospace;color:#fff;background:rgba(0,0,0,.75);padding:4px;margin-top:4px;margin-left:4px}.thingy{margin-top:10px;margin-bottom:10px}.thingy:first-child{margin-top:0}ul.navbar{display:flex;list-style-type:none;margin:0;padding:0;justify-content:flex-end}ul.navbar li{border-right:1px solid grey;margin-right:8px;padding-right:8px}ul.navbar li:last-child{border-right:none;padding-right:0;margin-right:0}.flex-widget{display:flex;flex-direction:column}.flex-widget label{margin-bottom:8px}.canvas{grid-area:canvas;display:flex;align-items:center;justify-content:center;overflow:hidden}.canvas.scrollable{display:block;overflow:auto}.sidebar .disabled{color:grey}.sidebar label.checkbox{display:block;margin-top:10px;margin-bottom:10px}.sidebar .color-widget{display:flex}.sidebar .color-widget label{flex-grow:1}.sidebar .numeric-slider{display:flex;flex-direction:column}.sidebar .numeric-slider .slider{display:flex}.sidebar .numeric-slider .slider input{flex-basis:90%}.overlay-wrapper{position:fixed;display:flex;background-color:rgba(0,0,0,.9);flex-direction:column;align-items:center;justify-content:center;color:#fff;top:0;left:0;bottom:0;right:0}</style><noscript> <p>Alas, you need JavaScript to peruse this page.</p> </noscript><div id="app" className="app"></div><script src="browser-main.f47bafba.js"></script>