Merge branch 'sept-10th-demo' into feature/FLAS-29-markdown-in-post-body

flaskr/static/collapse.js

@@ -0,0 +1,24 @@
+document.addEventListener("DOMContentLoaded", function() {
+    const toggleAllButton = document.getElementById("toggle-all");
+    const postHeaders = document.querySelectorAll(".post-header");
+    const posts = document.querySelectorAll(".post");
+
+    toggleAllButton.addEventListener("click", function() {
+        posts.forEach(post => {
+            post.classList.toggle("collapsed");
+        });
+    });
+
+    postHeaders.forEach(header => {
+        header.addEventListener("click", function(event) {
+            const postId = event.currentTarget.getAttribute("onclick").match(/\d+/)[0];
+            togglePostBody(postId);
+        });
+    });
+});
+
+function togglePostBody(postId) {
+    const postBody = document.getElementById(`post-body-${postId}`);
+    const post = postBody.closest(".post");
+    post.classList.toggle("collapsed");
+}

flaskr/static/style.css

@@ -88,6 +88,7 @@ nav ul li a, nav ul li span, header .action {
   display: flex;
   align-items: flex-end;
   font-size: 0.85em;
+  cursor: pointer;
 }
 
 .post > header > div:first-of-type {
@@ -106,6 +107,7 @@ nav ul li a, nav ul li span, header .action {
 
 .post .body {
   white-space: pre-line;
+  display: block;
 }
 
 .content:last-child {
@@ -249,3 +251,7 @@ body.dark-mode .editor-toolbar {
 body.dark-mode .CodeMirror {
   border: 1px solid #555;
 }
+
+.post.collapsed .body {
+  display: none;
+}