Updates

index.html

@@ -7,8 +7,8 @@
 <meta name="mobile-web-app-capable" content="yes"><meta name="theme-color" content="#000"><meta name="application-name" content="Mondrian Layout"><link rel="apple-touch-icon" sizes="57x57" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-icon-57x57.png"><link rel="apple-touch-icon" sizes="60x60" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-icon-60x60.png"><link rel="apple-touch-icon" sizes="72x72" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-icon-72x72.png"><link rel="apple-touch-icon" sizes="76x76" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-icon-76x76.png"><link rel="apple-touch-icon" sizes="114x114" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-icon-114x114.png"><link rel="apple-touch-icon" sizes="120x120" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-icon-120x120.png"><link rel="apple-touch-icon" sizes="144x144" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-icon-144x144.png"><link rel="apple-touch-icon" sizes="152x152" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-icon-152x152.png"><link rel="apple-touch-icon" sizes="180x180" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-icon-180x180.png"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"><meta name="apple-mobile-web-app-title" content="Mondrian Layout"><link rel="apple-touch-startup-image" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 1)" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-startup-image-320x460.png"><link rel="apple-touch-startup-image" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2)" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-startup-image-640x920.png"><link rel="apple-touch-startup-image" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-startup-image-640x1096.png"><link rel="apple-touch-startup-image" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2)" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-startup-image-750x1294.png"><link rel="apple-touch-startup-image" media="(device-width: 414px) and (device-height: 736px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3)" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-startup-image-1182x2208.png"><link rel="apple-touch-startup-image" media="(device-width: 414px) and (device-height: 736px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 3)" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-startup-image-1242x2148.png"><link rel="apple-touch-startup-image" media="(device-width: 768px) and (device-height: 1024px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 1)" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-startup-image-748x1024.png"><link rel="apple-touch-startup-image" media="(device-width: 768px) and (device-height: 1024px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 1)" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-startup-image-768x1004.png"><link rel="apple-touch-startup-image" media="(device-width: 768px) and (device-height: 1024px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2)" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-startup-image-1496x2048.png"><link rel="apple-touch-startup-image" media="(device-width: 768px) and (device-height: 1024px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2)" href="icons-7c02a4a4798c933b3df139396f23f274/apple-touch-startup-image-1536x2008.png"><meta name="msapplication-TileColor" content="#000"><meta name="msapplication-TileImage" content="mstile-144x144.png"><meta name="msapplication-config" content="browserconfig.xml"><link rel="icon" type="image/png" sizes="32x32" href="icons-7c02a4a4798c933b3df139396f23f274/favicon-32x32.png"><link rel="icon" type="image/png" sizes="16x16" href="icons-7c02a4a4798c933b3df139396f23f274/favicon-16x16.png"><link rel="shortcut icon" href="icons-7c02a4a4798c933b3df139396f23f274/favicon.ico"><style>
     html{box-sizing:border-box}*,:after,:before{box-sizing:inherit}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:#393939}h1{font-weight:400}.visually-hidden{position:absolute;overflow:hidden;clip:rect(0 0 0 0);height:1px;width:1px;margin:-1px;padding:0;border:0}.github-corner{fill:#fff;color:#222;position:absolute;top:0;border:0;right:0;opacity:.85}@media (min-width:1024px){body{overflow:hidden}.main{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;width:100vw;height:100vh}}.blocks-section{position:relative;padding:1rem;opacity:0}.blocks-section.ready{opacity:1}.blocks-section:before{content:"";padding-top:50%;display:block}.blocks-layout{position:absolute;top:50%;left:50%;overflow:hidden}.blocks-layout:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border:5px solid #b22222;z-index:-1}.blocks-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));grid-auto-flow:dense;grid-auto-rows:100px;margin:0;padding:0;list-style:none;width:200%;-ms-touch-action:none;touch-action:none;background:#000}.blocks-grid li{position:relative;display:block}.blocks-grid li:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:url(bg-pattern.0722ca109890b10ba2f7.png);opacity:.075}@media (min-width:1024px){.blocks-section{padding:1rem;width:80vw;-ms-flex:0 0 auto;flex:0 0 auto;height:100%}}.settings-section{position:relative;background:#222;padding:1rem;color:#fff;height:100%;-ms-flex:1 1 auto;flex:1 1 auto;overflow-y:auto}.settings-top{text-align:center;margin:0 0 1rem}.settings-top img{width:50px}.settings-form{display:none}.settings-form.active{display:block}.settings-form fieldset{border:none;margin:0 0 30px;padding:0}.settings-form fieldset legend{display:block;text-align:left!important;color:#fff;margin:0 0 14px;text-align:center;font-size:1.4rem;line-height:1}.settings-form fieldset>:last-child{margin-bottom:0!important}.settings-form table{width:100%}.settings-form table tr:last-child td{border-bottom:none}.settings-form table td{vertical-align:middle;line-height:1;border-bottom:10px solid transparent}.settings-form table td:first-child{padding-right:5px}.settings-form .field-label,.settings-form label{white-space:nowrap}.settings-form input[type=number],.settings-form input[type=text]{width:100%;max-width:100%;border:1px solid #4e4e4e;background:#393939;color:#fff;height:40px;padding:0 10px;margin:0;box-shadow:none}.settings-form input[type=number]{margin:0;-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}.settings-form input[type=number]::-webkit-inner-spin-button,.settings-form input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}.settings-form button{display:block;width:100%;background:#222;color:#fff;border:1px solid #adadad;padding:0;margin:0 0 10px;text-transform:uppercase;text-align:center;height:40px}.settings-form button.primary{background:#228b22;border-color:#228b22}.settings-form button.alert{background:#b22222;border-color:#b22222}.field{position:relative;margin:0 0 10px}.field-group{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center}.field-group>*{-ms-flex:1 1 0px;flex:1 1 0px;margin:0 10px 0 0}.field-group>:last-child{margin:0}.divider{box-sizing:content-box;height:0;overflow:visible;text-align:inherit;margin:0 0 15px;border:0;text-align:center}.divider:after{content:"";display:inline-block;width:100px;max-width:100%;border-top:1px solid #4e4e4e;vertical-align:top}
 </style>
-<link href="styles-47ea732a6441cb9a2945.b76fac31.css" rel="preload" as="style" onload="this.onload=null;this.rel='stylesheet'">
-<noscript><link href="styles-47ea732a6441cb9a2945.b76fac31.css" rel="stylesheet"></noscript>
+<link href="styles-b1a3b8e1433e3d41557c.77829370.css" rel="preload" as="style" onload="this.onload=null;this.rel='stylesheet'">
+<noscript><link href="styles-b1a3b8e1433e3d41557c.77829370.css" rel="stylesheet"></noscript>
 <script>!function(n){"use strict";n.loadCSS||(n.loadCSS=function(){});var o=loadCSS.relpreload={};if(o.support=function(){var e;try{e=n.document.createElement("link").relList.supports("preload")}catch(t){e=!1}return function(){return e}}(),o.bindMediaToggle=function(t){var e=t.media||"all";function a(){t.addEventListener?t.removeEventListener("load",a):t.attachEvent&&t.detachEvent("onload",a),t.setAttribute("onload",null),t.media=e}t.addEventListener?t.addEventListener("load",a):t.attachEvent&&t.attachEvent("onload",a),setTimeout(function(){t.rel="stylesheet",t.media="only x"}),setTimeout(a,3e3)},o.poly=function(){if(!o.support())for(var t=n.document.getElementsByTagName("link"),e=0;e<t.length;e++){var a=t[e];"preload"!==a.rel||"style"!==a.getAttribute("as")||a.getAttribute("data-loadcss")||(a.setAttribute("data-loadcss",!0),o.bindMediaToggle(a))}},!o.support()){o.poly();var t=n.setInterval(o.poly,500);n.addEventListener?n.addEventListener("load",function(){o.poly(),n.clearInterval(t)}):n.attachEvent&&n.attachEvent("onload",function(){o.poly(),n.clearInterval(t)})}"undefined"!=typeof exports?exports.loadCSS=loadCSS:n.loadCSS=loadCSS}("undefined"!=typeof global?global:this);</script></head>
 <body>
     <main class="main">
@@ -116,5 +116,5 @@ <h1 class="visually-hidden">Mondrian Layout with CSS and JS</h1>
             </form>
         </div>
     </main>
-<script type="text/javascript" src="main.079572c94e76aea30bc5.js"></script></body>
+<script type="text/javascript" src="main.6b0980b25e9a1453851d.js"></script></body>
 </html>