Update week9.html

user0disconnect · Nov 29, 2023 · ddf7cfb · ddf7cfb
1 parent 1698837
commit ddf7cfb
Showing 1 changed file with 68 additions and 1 deletion.
diff --git a/Labs/week9/week9.html b/Labs/week9/week9.html
@@ -25,6 +25,10 @@
             font-weight: bold;
             text-shadow: 5px 5px 3px blue;
         }
+        h3 
+        { text-align: center;
+            font-weight: bold;
+        }
         p {  
             margin: 20px;
             line-height: 1.5;
@@ -124,6 +128,22 @@
   font-size: 18px;
   padding-left: 20px;
 }
+         {
+  box-sizing: border-box;
+}
+
+.column {
+  float: left;
+  width: 33.33%;
+  padding: 5px;
+}
+
+/* Clearfix (clear floats) */
+.row::after {
+  content: "";
+  clear: both;
+  display: table;
+}
 
     </style>
 </head>
@@ -166,7 +186,54 @@ <h2>Task 1: Similarity</h2>
 </div>
 
     <h2>Task 2: Transcription</h2>
-
+<p>For this task, I took a composition that I worked with for the first few weeks called Spiegel im Spiegel by Arvo Pärt. In fact, the png files were taken from the MuseScore of the second week of the lab. Below, you can find the image files that were obtained as a result of transcribing the audio with SonicVisualiser and placed in MuseScore. </p>
+<h3>Original Version</h3>
+
+    <div class="row">
+  <div class="column">
+    <img src="spiegel_im_spiegel_part-1.png" style="width:100%">
+       <caption style="text-align:center;font-weight: bold;"></caption>
+  </div>
+  <div class="column">
+    <img src="spiegel_im_spiegel_part-2.png" style="width:100%">
+       <caption style="text-align:center;font-weight: bold;"></caption>
+  </div>
+  <div class="column">
+    <img src="spiegel_im_spiegel_part-3.png" style="width:100%">
+       <caption style="text-align:center;font-weight: bold;"></caption> 
+  </div>
+         <div class="column">
+    <img src="spiegel_im_spiegel_part-4.png" style="width:100%">
+       <caption style="text-align:center;font-weight: bold;"></caption>
+  </div>
+</div>
+    <h3>Transcribed Version</h3>
+ <div class="row">
+  <div class="column">
+    <img src="spiegel_transformed-1.png" style="width:100%">
+       <caption style="text-align:center;font-weight: bold;"></caption>
+  </div>
+  <div class="column">
+    <img src="spiegel_transformed-2.png" style="width:100%">
+       <caption style="text-align:center;font-weight: bold;"></caption>
+  </div>
+  <div class="column">
+    <img src="spiegel_transformed-3.png" style="width:100%">
+       <caption style="text-align:center;font-weight: bold;"></caption> 
+  </div>
+         <div class="column">
+    <img src="spiegel_transformed-4.png" style="width:100%">
+       <caption style="text-align:center;font-weight: bold;"></caption>
+  </div>
+     <div class="column">
+    <img src="spiegel_transformed-5.png" style="width:100%">
+       <caption style="text-align:center;font-weight: bold;"></caption>
+  </div>
+      <div class="column">
+    <img src="spiegel_transformed-6.png" style="width:100%">
+       <caption style="text-align:center;font-weight: bold;"></caption>
+  </div>
+</div>