4 files changed, 61 insertions, 13 deletions
diff --git a/templates/article-resource.html b/templates/article-resource.html
new file mode 100644
index 0000000..e3d9cac
--- /dev/null
+++ b/templates/article-resource.html
@@ -0,0 +1,44 @@
+<article>
+  $if(thumbnail)$
+  <div class="thumbnail" style="height: 30vh;">$thumbnail$</div>
+  $endif$
+  $if(torrent)$
+  <div>
+    <video controls class="thumbnail" id="media-$id$" style="height: 30vh;"></video>
+    <script type='module'>
+      const torrentId = '$torrent$';
+      const player = document.querySelector('#media-$id$');
+      window.torrentClient.add(torrentId, torrent => {
+        const file = torrent.files.find(file => file.name.endsWith('.mp4'));
+        file.streamTo(player);
+      });
+    </script>
+  </div>
+  $endif$
+  <div class="panel">
+    <section class="header">
+      <div class="title">
+        <h1>$title$</h1>
+        <a href="https://infoculture.pub$url$">permalink</a>
+        <a href="/$path$">raw</a>
+        $if(torrent)$
+        <a href="$torrent$">magnet link</a>
+        $endif$
+      </div>
+      <div class="meta">
+        $if(author)$
+        <h2 class="author">$author$</h2>
+        $endif$
+        <h3 class="date">$date$</h3>
+        $if(tags)$
+        <h3 class="tags">$tags$</h3>
+        $endif$
+      </div>
+    </section>
+    <br>
+    <br>
+    <section>
+      $body$
+    </section>
+  </div>
+</article>
+\ No newline at end of file
diff --git a/templates/article.html b/templates/article.html
index e5ed720..3de52e4 100644
--- a/templates/article.html
+++ b/templates/article.html
@@ -3,17 +3,15 @@
   <div class="thumbnail" style="height: 30vh;">$thumbnail$</div>
   $endif$
   $if(torrent)$
-  <div>
-    <video controls class="thumbnail" id="media-$id$" style="height: 30vh;"></video>
-    <script type='module'>
-      const torrentId = '$torrent$';
-      const player = document.querySelector('#media-$id$');
-      window.torrentClient.add(torrentId, torrent => {
-        const file = torrent.files.find(file => file.name.endsWith('.mp4'));
-        file.streamTo(player);
-      });
-    </script>
-  </div>
+  <video controls class="thumbnail" id="media-$id$" style="height: 30vh;"></video>
+  <script type='module'>
+    const torrentId = '$torrent$';
+    const player = document.querySelector('#media-$id$');
+    window.torrentClient.add(torrentId, torrent => {
+      const file = torrent.files.find(file => file.name.endsWith('.mp4'));
+      file.streamTo(player);
+    });
+  </script>
   $endif$
   <div class="panel">
     <section class="header">
diff --git a/templates/resource.html b/templates/resource.html
new file mode 100644
index 0000000..b93984a
--- /dev/null
+++ b/templates/resource.html
@@ -0,0 +1,6 @@
+<main role="main">
+  $if(torrent)$
+  $partial("templates/load-webtorrent.html")$
+  $endif$
+  $partial("templates/article.html")$
+</main>
+\ No newline at end of file
diff --git a/templates/thumbs.html b/templates/thumbs.html
index 3fcc6f7..6070c23 100644
--- a/templates/thumbs.html
+++ b/templates/thumbs.html
@@ -6,7 +6,7 @@
     <br>
     $endif$
     $if(torrent)$
-    <video controls class="thumbnail" id="media-$id$" style="height: 30vh;"></video>
+    <video controls class="thumbnail" id="media-$id$" style="height: 20vh;"></video>
     <script type='module'>
       const torrentId = '$torrent$';
       const player = document.querySelector('#media-$id$');
@@ -40,4 +40,4 @@
     $endif$
   </div>
   $endfor$
-</div>
+</div>
+\ No newline at end of file