Loadingアイコン表示

index.html

@@ -368,6 +368,10 @@
             let height = window.document.documentElement.clientHeight;
             result.classList.remove("d-none");
             result.textContent = "";
+            let loading = document.createElement("div");
+            result.appendChild(loading);
+            loading.classList.add("spinner-border");
+            loading.classList.add("text-primary");
             createEditor();
             setTimeout(function () {
                 html2canvas(document.getElementById("edit"), {
@@ -391,6 +395,7 @@
                         return x;
                     }
                 }).then(canvas => {
+                    result.textContent = "";
                     let i = document.createElement("img");
                     i.setAttribute("src", canvas.toDataURL('image/png'));
                     result.appendChild(i);
@@ -493,10 +498,11 @@
         document.getElementById("textShadowToggleB").addEventListener("click", function () {
             document.getElementById("textShadowToggleA").classList.add("opacity-50");
             this.classList.toggle("opacity-50");
+            let strokeSize = Math.ceil(document.querySelector("#left input").style.fontSize.replace("px", "") / 10);
             if (this.classList.contains("opacity-50")) {
                 document.getElementById("text-shadow").textContent = "";
             } else {
-                document.getElementById("text-shadow").textContent = '#mainMassage input, .shadow-text {-webkit-text-stroke: 1px black;paint-order: stroke fill;}';
+                document.getElementById("text-shadow").textContent = '#mainMassage input, .shadow-text {-webkit-text-stroke: ' + strokeSize + 'px black;paint-order: stroke fill;}';
             }
         });
         document.getElementById("userInterfaceToggle").addEventListener("click", function () {