Updates

thomcsmits · Jul 2, 2024 · 38c3784 · 38c3784
1 parent 88ac5aa
commit 38c3784
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 7 deletions.
diff --git a/assets/index-C6XpWooa.css b/assets/index-C6XpWooa.css
diff --git a/assets/index-BmOXDaV5.js → assets/index-Lm5nCZ_7.js b/assets/index-BmOXDaV5.js → assets/index-Lm5nCZ_7.js
diff --git a/assets/index-iDbZbOjW.css b/assets/index-iDbZbOjW.css
diff --git a/index.html b/index.html
@@ -4,8 +4,8 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Transitioning Charts</title>
-    <script type="module" crossorigin src="/transitioning-charts/assets/index-BmOXDaV5.js"></script>
-    <link rel="stylesheet" crossorigin href="/transitioning-charts/assets/index-iDbZbOjW.css">
+    <script type="module" crossorigin src="/transitioning-charts/assets/index-Lm5nCZ_7.js"></script>
+    <link rel="stylesheet" crossorigin href="/transitioning-charts/assets/index-C6XpWooa.css">
   </head>
   <body>
     <h1>Introducing new chart types</h1>
@@ -35,8 +35,9 @@ <h4>Tasks</h4>
         </ul>
       </li>
     </ul>
-    <h4>Description</h4>
+    <h4>Chart</h4>
     <div id="seqlogo-top" role="img" alt="Alt is omitted on purpose for this study"></div>
+    <h4>Description</h4>
     <p>
       Imagine a sequence logo plot as a series of vertical bars that are stacked on top of each other, where each bar represents a position in a sequence. Here’s how you can visualize and draw it:
       <ol>
@@ -93,8 +94,9 @@ <h4>Tasks</h4>
       </li>
     </ul>
     <h4>Bar Chart</h4>
-    <h5>Description</h5>
+    <h5>Chart</h5>
     <div id="seqlogo-barchart" role="img" alt="Alt is omitted on purpose for this study"></div>
+    <h5>Description</h5>
     <p>
       Imagine a series of vertical bars arranged side by side on a horizontal axis. Each bar represents a different position along the x-axis, from 0 to 9. The height of each bar corresponds to the total value for that position, given by `y_total`.
 
@@ -106,8 +108,9 @@ <h5>Description</h5>
     </p>
     <h5>Pause here to sketch the chart.</h5>
     <h4>Stacked Bar Chart</h4>
-    <h5>Description</h5>
+    <h5>Chart</h5>
     <div id="seqlogo-stacked-barchart" role="img" alt="Alt is omitted on purpose for this study"></div>
+    <h5>Description</h5>
     <p>
       To transform the bar chart into a stacked bar chart, you break each black bar into four segments stacked on top of each other, with each segment representing a different letter: A, G, C, and T. The height of each segment within a bar corresponds to the value of A, G, C, and T, respectively.
 
@@ -126,8 +129,9 @@ <h5>Description</h5>
     </p>
     <h5>Pause here to sketch the chart.</h5>
     <h4>Sequence Logo</h4>
-    <h5>Description</h5>
+    <h5>Chart</h5>
     <div id="seqlogo-full" role="img" alt="Alt is omitted on purpose for this study"></div>
+    <h5>Description</h5>
     <p>
       In a sequence logo plot, each position along the x-axis is depicted as a stack of letters, with the height of each letter representing its frequency. The letters are arranged in order of their predominance, with the most frequent letter at the top.