Allow expanding the header on hover for long messages, tweak font sizes and weights

src/Whoops/Resources/css/whoops.base.css

@@ -39,8 +39,14 @@ header {
   box-sizing: border-box;
   background-color: #2a2a2a;
   padding: 35px 40px;
+  max-height: 230px;
+  overflow: hidden;
 }
 
+  header:hover {
+    max-height: 1000px;
+  }
+
   .exc-title {
     margin: 0;
     color: #bebebe;
@@ -48,7 +54,6 @@ header {
   }
     .exc-title-primary {
       color: #e95353;
-      font-weight: bold;
     }
 
     .exc-message {
@@ -57,6 +62,10 @@ header {
       margin: 4px 0 0 0;
       color: white;
     }
+      .exc-message-empty-notice {
+        color: #a29d9d;
+        font-weight: 300;
+      }
 
 .stack-container {
   height: 100%;
@@ -75,7 +84,7 @@ header {
   }
 
     .details-heading {
-      color: #303030;
+      color: #4288CE;
       font-weight: 300;
       padding-bottom: 10px;
       margin-bottom: 10px;
@@ -226,8 +235,8 @@ header {
 
 .data-table-container label {
   font-size: 16px;
+  color: #303030;
   font-weight: bold;
-  color: #4288CE;
   margin: 10px 0;
 
   display: block;

src/Whoops/Resources/views/header.html.php

@@ -29,6 +29,10 @@
   <span id="plain-exception"><?php echo $tpl->escape($plain_exception) ?></span>
 
   <p class="exc-message">
-    <?php echo $tpl->escape($message) ?>
+    <?php if (!empty($message)): ?>
+      <?php echo $tpl->escape($message) ?>
+    <?php else: ?>
+      <span class="exc-message-empty-notice">No message</span>
+    <?php endif ?>
   </p>
 </div>