fix: viewBox issue (#741)

src/editor/dialogs/svgSourceDialog.html

@@ -54,6 +54,20 @@
         margin-left: 30%;
         margin-top: 5px;
     }
+    
+    #tool_source_dynamic {
+        cursor: pointer;
+    }
+    
+    .tool_label {
+        cursor: pointer;
+        margin: 5px 0;
+        display: inline-block;
+        -webkit-user-select: none;
+        -moz-user-select: none;
+        -ms-user-select: none;
+        user-select: none;
+    }
 
     #tool_source_cancel {
         width: 20%;
@@ -73,5 +87,8 @@
         <form>
             <textarea id="svg_source_textarea" spellcheck="false" rows="5" cols="80"></textarea>
         </form>
+        <label class="tool_label" for="tool_source_dynamic">
+          <input type="checkbox" id="tool_source_dynamic" checked>Toggle dynamic size
+        </label>
     </div>
 </elix-dialog>

src/editor/dialogs/svgSourceDialog.js

@@ -22,6 +22,8 @@ export class SeSvgSourceEditorDialog extends HTMLElement {
     this.$sourceTxt = this._shadowRoot.querySelector('#svg_source_textarea')
     this.$copySec = this._shadowRoot.querySelector('#save_output_btns')
     this.$applySec = this._shadowRoot.querySelector('#tool_source_back')
+    this.$toggleDynamic = this._shadowRoot.querySelector('#tool_source_dynamic')
+    this.$toggleDynamic.checked = svgEditor.configObj.curConfig.dynamicOutput
   }
 
   /**
@@ -195,9 +197,19 @@ export class SeSvgSourceEditorDialog extends HTMLElement {
       })
       this.dispatchEvent(closeEvent)
     }
+    const onToggleDynamicHandler = () => {
+      const closeEvent = new CustomEvent('change', {
+        detail: {
+          dynamic: this.$toggleDynamic.checked,
+          dialog: 'dynamic'
+        }
+      })
+      this.dispatchEvent(closeEvent)
+    }
     svgEditor.$click(this.$copyBtn, onCopyHandler)
     svgEditor.$click(this.$saveBtn, onSaveHandler)
     svgEditor.$click(this.$cancelBtn, onCancelHandler)
+    svgEditor.$click(this.$toggleDynamic, onToggleDynamicHandler)
     this.$dialog.addEventListener('close', onCancelHandler)
   }
 }