Added Toggle Button with Animation

index.html

@@ -60,7 +60,7 @@
               <div class="handle"></div>
             </div>
           </div>
-        
+
         </div> <!-- card-body -->
       </div> <!-- card -->
 
@@ -68,16 +68,13 @@
 
       <!-- Diagram card -->
       <div class="card" id="diagram-card">
-        <div class="card-header">
-          Diagramm
-          <button type="button" class="btn btn-info btn-block" data-toggle="collapse" data-target="#selection-box">
-            <svg id="icon-up-arrow" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 8 8" xml:space="preserve">
-              <rect x="0.016" y="1.68" transform="matrix(-0.7071 0.7071 -0.7071 -0.7071 6.2428 2.2389)" width="5.283" height="1.466"/>
-              <rect x="3.161" y="1.604" width="1.683" height="6.375"/>
-              <rect x="2.709" y="1.674" transform="matrix(0.7073 0.7069 -0.7069 0.7073 3.2674 -3.0786)" width="5.284" height="1.465"/>
+        <div class="card-header" style="padding:0;">
+          <div id="toggle-btn">
+            <svg id="icon-up-arrow" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 120 120" xml:space="preserve" transform="rotate(-90)">
+              <polygon fill="#010101" points="102.296,59.957 42.264,119.99 25.605,103.34 85.639,43.299 "/>
+              <polygon fill="#010101" points="85.74,76.71 25.715,16.653 42.373,0.011 102.391,60.067 "/>
             </svg>
-            Collapse
-          </button>
+          </div>
         </div>
         <div class="card-body">