adding verbiage and timing

2 files changed, 16 insertions, 10 deletions

diff --git a/site/public/test/index.html b/site/public/test/index.html
index b4d16036..41f8eda5 100644
--- a/site/public/test/index.html
+++ b/site/public/test/index.html
@@ -30,14 +30,14 @@
     
   <section><h1>Megapixels UI Tests</h1>
 <ul>
-<li><a href="/test/style">Style Guide</a></li>
-<li><a href="/test/csv">CSV</a></li>
-<li><a href="/test/datasets/">Dataset list</a></li>
-<li><a href="/test/citations/">Citation list</a></li>
-<li><a href="/test/map/">Citation map</a></li>
-<li><a href="/test/face_search/">Face search</a></li>
-<li><a href="/test/name_search/">Name search</a></li>
-<li><a href="/test/gallery/">Modal image gallery</a></li>
+<li><a href="/test/style/index.html">Style Guide</a></li>
+<li><a href="/test/csv/index.html">CSV</a></li>
+<li><a href="/test/datasets/index.html">Dataset list</a></li>
+<li><a href="/test/citations/index.html">Citation list</a></li>
+<li><a href="/test/map/index.html">Citation map</a></li>
+<li><a href="/test/face_search/index.html">Face search</a></li>
+<li><a href="/test/name_search/index.html">Name search</a></li>
+<li><a href="/test/gallery/index.html">Modal image gallery</a></li>
 </ul>
 </section>
 
diff --git a/site/public/test/style/index.html b/site/public/test/style/index.html
index 6d99a236..ab13a589 100644
--- a/site/public/test/style/index.html
+++ b/site/public/test/style/index.html
@@ -54,10 +54,16 @@
 <div class='image'><img src='https://nyc3.digitaloceanspaces.com/megapixels/v1/site/test/assets/man.jpg' alt='Person 3. Let me tell you about Person 3.  This person has a very long description with text which wraps like crazy'><div class='caption'>Person 3. Let me tell you about Person 3.  This person has a very long description with text which wraps like crazy</div></div></section><section><blockquote><p>est, qui dolorem ipsum, quia dolor sit amet consectetur adipisci[ng] velit, sed quia non-numquam [do] eius modi tempora inci[di]dunt, ut labore et dolore magnam aliquam quaerat voluptatem.</p>
 </blockquote>
 </section><section class='wide'><div class='image'><img src='https://nyc3.digitaloceanspaces.com/megapixels/v1/site/test/assets/wide-test.jpg' alt='This image is extremely wide and the text beneath it will wrap but thats fine because it can also contain <a href="https://example.com/">hyperlinks</a>! Yes, you read that right&mdash;hyperlinks! Lorem ipsum dolor sit amet ad volotesque sic hoc ad nauseam'><div class='caption'>This image is extremely wide and the text beneath it will wrap but that's fine because it can also contain <a href="https://example.com/">hyperlinks</a>! Yes, you read that right&mdash;hyperlinks! Lorem ipsum dolor sit amet ad volotesque sic hoc ad nauseam</div></div></section><section><p>Inline <code>code</code> has <code>back-ticks around</code> it.</p>
-</section><section class='applet_container'><div class='applet' data-payload='{"command": "javascript", "fields": ["var s = \"JavaScript syntax highlighting\";", "alert(s);"]}'></div></section><section><pre><code class="lang-python">s = &quot;Python syntax highlighting&quot;
+</section><section><pre><code class="lang-javascript">var s = &quot;JavaScript syntax highlighting&quot;;
+alert(s);
+</code></pre>
+</section><section><pre><code class="lang-python">s = &quot;Python syntax highlighting&quot;
 print(s)
 </code></pre>
-</section><section class='applet_container'><div class='applet' data-payload='{"command": "No language indicated, so no syntax highlighting. ", "fields": ["But let's throw in a <b>tag</b>."]}'></div></section><section><p>Horizontal rule</p>
+</section><section><pre><code class="lang-code">Generic code block. Note that code blocks that are not so marked will not appear.
+But let&#39;s throw in a &lt;b&gt;tag&lt;/b&gt;.
+</code></pre>
+</section><section><p>Horizontal rule</p>
 <hr>
 <p>Citations below here</p>
 <div class="footnotes">