Add jquery resizing to all pages

assets/clone.html

@@ -38,8 +38,7 @@
 						</div>
 
 						<div class="form-group is-empty" style="margin-top: 0px;">
-							<textarea class="form-control" rows="20" id="textArea">{{printf "%s" .Body}}</textarea>
+							<textarea class="form-control" rows="20" id="textArea" data-autoresize>{{printf "%s" .Body}}</textarea>
-
 							<span class="help-block">Paste your text here</span>
 						</div>
 					</div>
@@ -479,6 +478,14 @@
 		<script src="https://cdn.jsdelivr.net/bootstrap.material-design/0.5.10/js/ripples.min.js" integrity="sha256-TY/EO/++Ug/P+fSBjaqlmtuphCBKwlP7TOnS+SGnN8g=" crossorigin="anonymous"></script>
 		<script>
 			$.material.init();
+			jQuery.each(jQuery('textarea[data-autoresize]'), function() {
+				var offset = this.offsetHeight - this.clientHeight;
+
+				var resizeTextarea = function(el) {
+					jQuery(el).css('height', 'auto').css('height', el.scrollHeight + offset);
+				};
+				jQuery(this).on('keyup input', function() { resizeTextarea(this); }).removeAttr('data-autoresize');
+			});
 		</script>
 
 	</body>

assets/paste.html

@@ -31,7 +31,7 @@
 			</div>
 
 			<div class="well" style="padding-top: 10px;">
-				<textarea class="form-control" rows="20" id="textArea">{{printf "%s" .Body}}</textarea>
+				<textarea class="form-control" rows="20" id="textArea" data-autoresize>{{printf "%s" .Body}}</textarea>
 			</div>
 
 			<div class="pull-right">
@@ -52,6 +52,15 @@
 		<script src="https://cdn.jsdelivr.net/bootstrap.material-design/0.5.10/js/ripples.min.js" integrity="sha256-TY/EO/++Ug/P+fSBjaqlmtuphCBKwlP7TOnS+SGnN8g=" crossorigin="anonymous"></script>
 		<script>
 			$.material.init();
+
+			jQuery.each(jQuery('textarea[data-autoresize]'), function() {
+				var offset = this.offsetHeight - this.clientHeight;
+
+				var resizeTextarea = function(el) {
+					jQuery(el).css('height', 'auto').css('height', el.scrollHeight + offset);
+				};
+				jQuery(this).on('keyup input', function() { resizeTextarea(this); }).removeAttr('data-autoresize');
+			});
 		</script>
 
 	</body>

assets/syntax.html

@@ -29,10 +29,11 @@
 			<div class="page-header">
 				<h1>%s</h1>
 			</div>
-
 			<div class="well" style="padding-top: 10px;">
+				<div class="col-md-12">
 					%s
 				</div>
+			</div>
 
 			<div class="pull-right">
 				<div class="row" style="margin-right: 0px;">