Finished setting up transcript editing mode

Frontend/templates/Frontend/undotree_2

@@ -0,0 +1,63 @@
+" Press ? for help.
+
+ *   [56] S (6 minutes ago)
+ *    55    (6 minutes ago)
+ *    54    (6 minutes ago)
+ *    53    (7 minutes ago)
+ *    52    (7 minutes ago)
+ *    51    (7 minutes ago)
+ *    50    (7 minutes ago)
+ *    49    (8 minutes ago)
+ *    48    (8 minutes ago)
+ *    47    (8 minutes ago)
+ *    46    (8 minutes ago)
+ *    45    (8 minutes ago)
+ *    44    (8 minutes ago)
+ *    43    (13 minutes ago)
+ *    42  s (13 minutes ago)
+ *    41    (14 minutes ago)
+ *    40    (14 minutes ago)
+ *   {39}   (14 minutes ago)
+ *   >38< s (5 hours ago)
+ *    37    (5 hours ago)
+ *    36    (5 hours ago)
+ *    35    (5 hours ago)
+ *    34    (5 hours ago)
+ *    33    (5 hours ago)
+ *    32    (5 hours ago)
+ *    31    (5 hours ago)
+ *    30    (5 hours ago)
+ | *    29    (21 hours ago)
+ |/
+ | *    28  s (21 hours ago)
+ |/
+ | *    27  s (22 hours ago)
+ | *    26    (22 hours ago)
+ | *    25    (22 hours ago)
+ |/
+ *    24  s (1 day ago)
+ *    23    (1 day ago)
+ *    22    (1 day ago)
+ *    21    (1 day ago)
+ *    20    (1 day ago)
+ *    19    (1 day ago)
+ *    18  s (1 day ago)
+ *    17    (1 day ago)
+ *    16  s (1 day ago)
+ *    15  s (1 day ago)
+ *    14    (1 day ago)
+ *    13  s (1 day ago)
+ *    12    (1 day ago)
+ *    11    (1 day ago)
+ *    10    (1 day ago)
+ *    9    (1 day ago)
+ *    8    (1 day ago)
+ | *    7  s (1 day ago)
+ | *    6    (1 day ago)
+ | *    5  s (1 day ago)
+ | *    4    (1 day ago)
+ | *    3    (1 day ago)
+ | *    2    (1 day ago)
+ | *    1    (1 day ago)
+ |/
+ *    0    (Original)

Frontend/templates/Frontend/video-editing.html

@@ -44,20 +44,24 @@
         </nav>
       </div>
 
-      <div class="transcript-container">
+      <div class="transcript-container-wrapper">
+
           <div class="transcript-controls">
-              <button id="save-transcript-button", onclick="editMode()">Edit</button>
+              <button id="edit-transcript", onclick="editTranscript()">Edit</button>
+              <button id="save-transcript", onclick="saveTranscript()">Save</button>
+              <button id="delete-transcript", onclick="deleteTranscript()">delete</button> 
           </div>
-        <div class="transcript-header">
-          <p></p>
-        </div>
 
-
-
-        <!-- Transcript -->
-      <div id = "transcript">
-
-        </div> 
+          <div class="transcript-container">
+              <div class="transcript-header">
+                  <p></p>
+              </div>
+
+              <!-- Transcript -->
+              <div id = "transcript">
+
+              </div> 
+          </div>
       </div>
 
       <!-- Video -->

static/css/video-editing.css

@@ -217,9 +217,25 @@ nav ul li a{
   color: white;
 }
 
-.transcript-container {
+#save-transcript{
+    display: none;
+}
+
+#delete-transcript{
+    display: none;
+}
+
+.transcript-container-wrapper {
   width: 30%;
-  height: 70%;
+  height: 75%;
+  display: flex;
+  flex-direction: column;
+}
+
+.transcript-container {
+  width: 100%;
+  height: 100%;
+  margin-left: 3%;
   float: left;
   font-family: Arial, sans-serif;
   padding: 50px;
@@ -230,8 +246,9 @@ nav ul li a{
   display: none;
 }
 .transcript-container-editing {
-  width: 30%;
-  height: 70%;
+  width: 100%;
+  height: 100%;
+  margin-left: 3%;
   float: left;
   font-family: Arial, sans-serif;
   padding: 50px;
@@ -248,7 +265,7 @@ nav ul li a{
 #transcript-editing p{
     font-size: 24px;
     font-weight: bold;
-    margin-bottom: 20px;
+    margin-bottom: 2%;
 }
 
 #transcript-editing span::selection{
@@ -290,7 +307,9 @@ nav ul li a{
 } */
 
 .transcript-controls {
-  margin-top: 20px;
+  margin-top: 10%;
+  margin-bottom: 5px;
+  margin-left: 3%;
   text-align: right;
 }