Run.js: make the output a pre area (-> allows auto-expand)

Author: wilzbach

css/style.css

@@ -1610,7 +1610,7 @@ div.changelog-nav
 
 /* Runnable-examples css */
 textarea.d_code {display: none;}
-textarea.d_code_output, textarea.d_code_stdin, textarea.d_code_args
+textarea.d_code_stdin, textarea.d_code_args
 {
     text-align: left;
     border: none;
@@ -1624,6 +1624,11 @@ textarea.d_code_output, textarea.d_code_stdin, textarea.d_code_args
     outline: none;
 }
 
+pre.d_code_output {
+    border: none;
+    max-height: 30em;
+}
+
 div.d_code {margin: 0; padding: 0; background: #F5F5F5;}
 div.d_run_code {display: none;}
 div.d_code_output, div.d_code_stdin, div.d_code_args, div.d_code_unittest
@@ -1681,6 +1686,11 @@ input.editButton:active
     position: relative; top: 1px;
 }
 input.resetButton{display: none}
+
+/* Style for the example run buttons on the Phobos library documentation */
+.d_example_buttons {
+    text-align: left;
+}
 /* Runnable-examples css -end */
 
 .page-contents
@@ -2113,8 +2123,3 @@ dt.d_decl:hover .decl_anchor {
     text-decoration: none;
     color: #333;
 }
-
-/* Style for the example run buttons on the Phobos library documentation */
-.d_example_buttons {
-    text-align: left;
-}

js/run_examples.js

@@ -82,7 +82,7 @@ $(document).ready(function()
                     + '<div class="d_run_code" style="display: block">'
                         + '<textarea class="d_code" style="display: none;"></textarea>'
                     + '</div>'
-                    + '<div class="d_code_output"><span class="d_code_title">Application output</span><br><textarea class="d_code_output" readonly>Running...</textarea>'
+                    + '<div class="d_code_output"><span class="d_code_title">Application output</span><br><pre class="d_code_output" readonly>Running...</pre>'
                 + '</div>'
         );
     });