Merge pull request #75 from WebCoder49/performance-improvements

Allow scrolling when highlight.js

Author: WebCoder49

code-input.css

@@ -45,12 +45,14 @@ code-input textarea, code-input:not(.code-input_pre-element-styled) pre code, co
   border: 0;
   min-width: calc(100% - var(--padding, 16px) * 2);
   min-height: calc(100% - var(--padding, 16px) * 2);
-  height: max-content;
   overflow: hidden;
   resize: none;
   grid-row: 1;
   grid-column: 1;
+}
+code-input:not(.code-input_pre-element-styled) pre code, code-input.code-input_pre-element-styled pre {
   height: max-content;
+  width: max-content;  
 }
 
 code-input:not(.code-input_pre-element-styled) pre, code-input.code-input_pre-element-styled pre code {

code-input.js

@@ -528,8 +528,13 @@ var codeInput = {
          */
         animateFrame() {
             // Sync size
-            this.textareaElement.style.height = getComputedStyle(this.preElement).height;
-            this.textareaElement.style.width = getComputedStyle(this.preElement).width;
+            if(this.template.preElementStyled) {
+                this.textareaElement.style.height = getComputedStyle(this.preElement).height;
+                this.textareaElement.style.width = getComputedStyle(this.preElement).width;
+            } else {
+                this.textareaElement.style.height = getComputedStyle(this.codeElement).height;
+                this.textareaElement.style.width = getComputedStyle(this.codeElement).width;
+            }
             this.textareaElement.scrollTo(0,0);
 
             // Sync content