Add message shortcode (#40)

site/themes/shared-bulma-theme

@@ -1 +1 @@
-Subproject commit 72ea06b00ee28d21e379c96ebf6c570dde379ee0
+Subproject commit 7a0f53400f6c363b26f5fb3f56b333c497ca31f7

src/js/layout.js

@@ -10,4 +10,14 @@ document.addEventListener("DOMContentLoaded", function() {
     document.querySelectorAll('.moment-timeago').forEach(x => {
         x.innerHTML = moment(x.innerHTML).fromNow()
     })
-})
+
+    // .is-dropdown
+    document.querySelectorAll('.is-dropdown').forEach(x => {
+        x.addEventListener('click', function(event) {
+            event.stopPropagation()
+            x.parentElement.querySelectorAll(".is-dropdown-target").forEach(child => {
+                child.classList.toggle('is-active')
+            })
+        });
+    })
+})

src/scss/yuzu/yuzu.scss

@@ -54,3 +54,34 @@ a:hover {
   display: flex;
   align-items: center;
 }
+
+// Fixes the backgrounds + colors of messages with headers
+.message {
+  background: $dark !important;
+}
+
+.message-header {
+  color: $dark;
+}
+
+// Fixes multiple <p> elements in messages in content blocks
+.message-header p:not(:last-child) {
+  margin-bottom: 0;
+}
+
+// Adds dropdown support for messsages
+.message-header.is-dropdown {
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
+.message-body.is-dropdown-target {
+  display: none;
+}
+
+.message-body.is-dropdown-target.is-active {
+  display: block !important;
+}