add citations in correct place

src/diagrams/video-example.svelte

@@ -199,7 +199,7 @@
     <!-- <div class="example-title"><a href={example.url}>  {example.title}</a><d-cite key={example.bibtex}></d-cite></div> -->
 
     <figcaption>
-        <a class="video-number" href="#{example.bibtex}">{example.id}</a>: In "<a href={example.url}>{example.title}</a> <d-cite key={example.bibtex}></d-cite>," {example.caption}
+        <a class="video-number" href="#{example.bibtex}">{example.id}</a>: In "<a href={example.url}>{example.title}</a>" <d-cite key={example.bibtex}></d-cite>, {example.caption}
         {#if !isMobile}
             <div id="video-lengths">
                 <span>

src/index.ejs

@@ -126,7 +126,7 @@
     <div>
       <p>
         <d-figure class="video-d-figure" id="webworks2009cutthroat"></d-figure>
-        The use of games to convey information has been explored in the domains of journalism <d-cite key="bogost2012newsgames"></d-cite> and education <d-cite key="squire2011video"></d-cite>. Designers of newsgames use them to help readers build empathy with their subject, for example in <i>The Financial Times's</i> "Uber Game <d-cite key="blood2017uber"></d-cite>," and explain complex systems consisting of multiple parts, for example in <i>Wired's</i> "Cutthroat Capitalism: The Game <d-cite key="webworks2009cutthroat"></d-cite>"). In educational settings the use of games has been shown to motivate students while maintaining or improving learning outcomes <d-cite key="virvou2005combining"></d-cite>.
+        The use of games to convey information has been explored in the domains of journalism <d-cite key="bogost2012newsgames"></d-cite> and education <d-cite key="squire2011video"></d-cite>. Designers of newsgames use them to help readers build empathy with their subject, for example in <i>The Financial Times's</i> "Uber Game" <d-cite key="blood2017uber"></d-cite>, and explain complex systems consisting of multiple parts, for example in <i>Wired's</i> "Cutthroat Capitalism: The Game" <d-cite key="webworks2009cutthroat"></d-cite>). In educational settings the use of games has been shown to motivate students while maintaining or improving learning outcomes <d-cite key="virvou2005combining"></d-cite>.
       </p>
 
       <p>
@@ -161,7 +161,7 @@
 
     <p>
       <d-figure class="video-d-figure" id="barron2018designing"></d-figure>
-      The dissemination of modern machine learning techniques has been bolstered by interactive models and simulations. Three articles, "How to Use t-SNE Effectively <d-cite key="wattenberg2016use"></d-cite>" and "The Beginner's Guide to Dimensionality Reduction <d-cite key="conlen2018dr"></d-cite>," and "Understanding UMAP<d-cite key="coenen2019understanding"></d-cite>" show the effect that hyperparameters and different dimensionality reduction techniques have on creating low dimensional embeddings of high-dimensional data. A popular approach is to demonstrate how machine learning models work with in-browser models <d-cite key="smilkov2019tensorflow"></d-cite>, for example, letting readers use their own video camera as inputs to an image classification model <d-cite key="barron2018designing"></d-cite>. Other examples are aimed at technical readers who wish to learn about specific concepts within deep learning. Here, interfaces allow readers to choose model hyperparameters, datasets, and training procedures that, once selected, visualize the training process and model internals to inspect the effect of varying the model configuration <d-cite key="smilkov2017direct,kahng2018ganlab"></d-cite>.
+      The dissemination of modern machine learning techniques has been bolstered by interactive models and simulations. Three articles, "How to Use t-SNE Effectively" <d-cite key="wattenberg2016use"></d-cite>, "The Beginner's Guide to Dimensionality Reduction" <d-cite key="conlen2018dr"></d-cite>, and "Understanding UMAP" <d-cite key="coenen2019understanding"></d-cite> show the effect that hyperparameters and different dimensionality reduction techniques have on creating low dimensional embeddings of high-dimensional data. A popular approach is to demonstrate how machine learning models work with in-browser models <d-cite key="smilkov2019tensorflow"></d-cite>, for example, letting readers use their own video camera as inputs to an image classification model <d-cite key="barron2018designing"></d-cite>. Other examples are aimed at technical readers who wish to learn about specific concepts within deep learning. Here, interfaces allow readers to choose model hyperparameters, datasets, and training procedures that, once selected, visualize the training process and model internals to inspect the effect of varying the model configuration <d-cite key="smilkov2017direct,kahng2018ganlab"></d-cite>.
     </p>
 
     <p>
@@ -223,7 +223,7 @@
     </p>
 
     <p>
-      An interactive medium has the potential to offer readers an experience other than static, linear text. Non-linear stories, where a reader can choose their own path through the content, have the potential to provide a more personalized experience and focus on areas of user interest <d-cite key="sizemore2011interactive"></d-cite>. For example, the <i>BBC</i> has used this technique in both online articles <d-cite key="lowther2017booze"></d-cite> and in a recent episode of "Click <d-cite key="beckett2019click"></d-cite>," a technology focused news television program. Non-linear stories present challenges for authors, as they must consider the myriad possible paths through the content, and consider the different possible experiences that the audience would have when pursuing different branches.
+      An interactive medium has the potential to offer readers an experience other than static, linear text. Non-linear stories, where a reader can choose their own path through the content, have the potential to provide a more personalized experience and focus on areas of user interest <d-cite key="sizemore2011interactive"></d-cite>. For example, the <i>BBC</i> has used this technique in both online articles <d-cite key="lowther2017booze"></d-cite> and in a recent episode of "Click" <d-cite key="beckett2019click"></d-cite>, a technology focused news television program. Non-linear stories present challenges for authors, as they must consider the myriad possible paths through the content, and consider the different possible experiences that the audience would have when pursuing different branches.
     </p>
 
     <p>