Improve dev error layout

* Match horizontal and vertical spacing in frame list.
* Removing escaping on arguments so they render correctly, and add
  a title.

src/Error/Debug/dumpHeader.html

@@ -5,6 +5,7 @@
   padding: 5px;
   line-height: 16px;
   font-size: 14px;
+  margin-bottom: 10px;
 
   /*
   Colours based on solarized scheme
@@ -25,6 +26,9 @@
 
   --indent: 20px;
 }
+.cake-debug:last-child {
+  margin-bottom: 0;
+}
 .cake-debug > span {
   display: block;
   margin-bottom: 10px;

templates/element/exception_stack_trace.php

@@ -55,8 +55,11 @@ foreach ($trace as $i => $stack):
         <?php endforeach; ?>
         </table>
 
-        <div id="stack-args-<?= $i ?>" style="display: none;">
-            <pre><?= h(implode("\n", $params)) ?></pre>
+        <div id="stack-args-<?= $i ?>" class="cake-debug" style="display: none;">
+            <h4>Arguments</h4>
+            <?php foreach ($params as $param): ?>
+                <div class="cake-debug"><?= $param ?></div>
+            <?php endforeach; ?>
         </div>
     </div>
 <?php endforeach; ?>

templates/layout/dev_error.php

@@ -139,10 +139,11 @@ use Cake\Error\Debugger;
     .stack-frame {
         background: #e5e5e5;
         padding: 10px;
-        margin-bottom: 5px;
+        margin-bottom: 10px;
     }
     .stack-frame:last-child {
         border-bottom: none;
+        margin-bottom: 0;
     }
     .stack-frame a {
         display: block;
@@ -211,7 +212,7 @@ use Cake\Error\Debugger;
 
     .code-excerpt {
         width: 100%;
-        margin: 10px 0;
+        margin: 10px 0 0 0;
         background: #fefefe;
     }
     .code-highlight {
@@ -232,6 +233,9 @@ use Cake\Error\Debugger;
     .excerpt-number:after {
         content: attr(data-number);
     }
+    .cake-debug {
+        margin-top: 10px;
+    }
 
     table {
         text-align: left;