feat: Implement toggle button functionality

gemeinsamforschen/src/main/webapp/assets/css/annotationStyle.css

@@ -91,6 +91,7 @@ ol {
     display: flex;
     align-items: center;
     justify-content: center;
+    cursor: pointer;
 }
 .annotation-body {
     padding: 8px;

gemeinsamforschen/src/main/webapp/assets/js/annotationScript.js

@@ -190,6 +190,9 @@ function displayAnnotation(annotation) {
                             )
                             .append(
                                 $('<div>').attr('class', 'annotation-header-toggle')
+                                    .click(function () {
+                                        toggleButtonHandler($(this));
+                                    })
                                     .append(
                                         $('<i>').attr('class', 'fas fa-chevron-down')
                                     )
@@ -333,3 +336,13 @@ function timestampIsToday(timestamp) {
     }
 }
 
+/**
+ * Toggle between the toggle button status
+ *
+ * @param element the given toggle button
+ */
+function toggleButtonHandler(element) {
+    element.parent().siblings(".annotation-body").children("p").toggleClass("overflow-hidden");
+    element.children("i").toggleClass("fa-chevron-down fa-chevron-up")
+}
+