Increase the vertical space for emails (#18)

The current space (250px) only supports around 10 emails. This adjustment should double it.
Adds handle to expand/contract message list as desired.

Co-authored-by: Stephen Mitchell

Author: Christian Jensen

src/mail_panel/static/debug_toolbar/mail/mail_toolbar.css

@@ -55,9 +55,10 @@
 
 }
 #djDebug .djm-mail-toolbar .djm-message-list {
-	max-height: 250px;
+	max-height: 500px;
 	overflow: scroll;
 	border: 1px solid #d5d6d5;
+	resize: vertical;
 }
 #djDebug .djm-mail-toolbar div#djm_message_container {
 	width:100%;
@@ -130,4 +131,4 @@
 	width: 15px;
 	height: 15px;
 	margin-right: 5px;
-}
+}

src/mail_panel/static/debug_toolbar/mail/toolbar.mail.js

@@ -19,11 +19,18 @@ function djmail_load(url, element, callback)
 
 djmail_document_ready(function(){
 
-    window.onresize = resize_message;
-
     var $q = document.querySelector.bind(document);
     var $qa = document.querySelectorAll.bind(document);
 
+    window.onresize = resize_message;
+
+    // resize on message list css resize
+    let observer = new MutationObserver(function(mutations) {
+      resize_message()
+    });
+    let child = $q('.djm-message-list');
+    observer.observe(child, { attributes: true });
+
     function resize_message() {
         let new_height = window.innerHeight - $q("#djm_message_container").getBoundingClientRect().top + window.scrollY + window.pageYOffset -10
         $q("#djm_message_container").style.height = new_height + "px";