Mobile-friendly embedded PDFs.

It turns out I'd misread some things. I thought you were supposed to put embeds inside objects, but actually objects supersede embeds. See https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies#the_embed_and_object_elements
neuropoly · Nov 1, 2021 · 1e783d6 · 1e783d6
1 parent 7721689
commit 1e783d6
Show file tree

Hide file tree

Showing 7 changed files with 17 additions and 5 deletions.
diff --git a/_static/_media/201907187tspinecoil.png b/_static/_media/201907187tspinecoil.png
diff --git a/_static/_media/20201120updatedprojects.png b/_static/_media/20201120updatedprojects.png
diff --git a/_static/_media/acdc3t.png b/_static/_media/acdc3t.png
diff --git a/_static/_media/neuropolyslides.png b/_static/_media/neuropolyslides.png
diff --git a/_static/theme.css b/_static/theme.css
@@ -69,7 +69,7 @@ div.pdf-container.r4-3 {
   padding-top: 78%;
 }
 
-div.pdf-container > embed[type="application/pdf"] {
+div.pdf-container > object[type="application/pdf"] {
   position: absolute;
   top: 0;
   left: 0;

diff --git a/research/README.md b/research/README.md
@@ -10,5 +10,8 @@ collaborations
 ```
 
 <div class="pdf-container r4-3">
-  <embed src="../_static/_media/neuropolyslides.pdf" type="application/pdf" />
+  <object data="../_static/_media/neuropolyslides.pdf" type="application/pdf">
+    <!-- fallback: -->
+    <a href="../_static/_media/neuropolyslides.pdf"><img src="../_static/_media/neuropolyslides.png" type="image/png" /></a>
+  </object>
 </div>
diff --git a/research/rf-and-shim-coil-design.md b/research/rf-and-shim-coil-design.md
@@ -5,17 +5,26 @@ The RF Lab is supported by [TransMedTech](https://www.polymtl.ca/transmedtech/en
 ## RF Coils for MRI
 
 <div class="pdf-container r16-9">
-  <embed src="../_static/_media/20201120updatedprojects.pdf" type="application/pdf" />
+  <object data="../_static/_media/20201120updatedprojects.pdf" type="application/pdf">
+    <!-- fallback -->
+    <a href="../_static/_media/20201120updatedprojects.pdf"><img src="../_static/_media/20201120updatedprojects.png" /></a>
+  </object>
 </div>
 
 ## C-Spine Coil for 7T MRI
 
 <div class="pdf-container r16-9">
-  <embed src="../_static/_media/201907187tspinecoil.pdf" type="application/pdf" />
+  <object data="../_static/_media/201907187tspinecoil.pdf" type="application/pdf" />
+    <!-- fallback -->
+    <a href="../_static/_media/201907187tspinecoil.pdf"><img src="../_static/_media/201907187tspinecoil.png" /></a>
+  </object>
 </div>
 
 ## Real-time shimming
 
 <div class="pdf-container r16-9">
-  <embed src="../_static/_media/acdc3t.pdf" type="application/pdf" />
+  <object data="../_static/_media/acdc3t.pdf" type="application/pdf" />
+    <!-- fallback -->
+    <a href="../_static/_media/acdc3t.pdf"><img src="../_static/_media/acdc3t.png" /></a>
+  </object>
 </div>