add support for inline pdf and videos

Author: digitalillusions

config.toml

@@ -8,9 +8,12 @@ compile_sass = false
 build_search_index = false
 
 [markdown]
+render_emoji = true
+
+[markdown.highlighting]
 # Whether to do syntax highlighting
 # Theme can be customised by setting the `highlight_theme` variable to a theme supported by Zola
-highlight_code = true
+theme = "github-light"
 
 [extra]
 # Put all your custom variables here

content/2026-TVCG-HYVE.pdf

@@ -14,15 +14,16 @@ affiliations = [
     { name = "KAUST", url = "https://computationalsciences.org/" },
 ]
 links = [
-    # { name = "Paper", url = "", icon = "pdf" },
-    { name = "arXiv", url = "https://arxiv.org/abs/2310.06644", icon = "ai" },
-    # { name = "Video", url = "", icon = "youtube" },
-    { name = "Code (Coming soon)", url = "https://github.com/InteractiveComputerGraphics/hyve", icon = "github" },
+    { name = "Paper", url = "2026-TVCG-HYVE.pdf", icon = "pdf" },
+    { name = "Version of Record", url = "https://dx.doi.org/10.1109/TVCG.2026.3658870", icon = "" },
+    { name = "Video", url = "https://www.youtube.com/watch?v=ykKsjeX2-0M", icon = "youtube" },
+    { name = "Code", url = "https://github.com/InteractiveComputerGraphics/hyve", icon = "github" },
+    { name = "Data", url = "https://huggingface.co/datasets/stefan-jeske/hyve-datasets", icon = "data" },
 ]
-_teaser_video = ""
+teaser_video = "/video/objaverse_720p.webm"
 +++
 
-# Abstract
+## :paperclip: Abstract
 
 Neural shape representation generally refers to representing 3D geometry using neural networks, e.g., computing a signed distance or occupancy value at a specific spatial position. 
 In this paper we present a neural-network architecture suitable for accurate encoding of 3D shapes in a single forward pass.
@@ -34,9 +35,38 @@ Furthermore, our network is trained to solve the well-established eikonal equati
 We additionally propose a modification to the aforementioned loss function for the case that surface normals are not well defined, e.g., in the context of non-watertight surfaces and non-manifold geometry.
 Overall, our method consistently outperforms other baselines on the surface reconstruction task across a wide variety of datasets, while being more computationally efficient and requiring fewer parameters.
 
-## More coming soon!
+## :rocket: Quickstart
 
-# BibTeX
+Its very easy to get started with our method simply run the following commands
+
+```sh,data-copy
+git clone https://github.com/InteractiveComputerGraphics/hyve.git
+cd hyve
+uv sync
+
+# Download honeycomb model from HF and run inference using two different models
+./run_honeycomb.sh
+```
+
+*Requires: Linux or Windows with CUDA*
+
+## :framed_picture: Gallery
+
+### Feature Projection vs Pooling
+
+{{ carousel(paths=["/video/thingi10k_proj.webm", "/video/armadillo_proj.webm", "/video/scannet_proj.webm",  "/video/dragon_proj.webm", "/video/dfaust_proj.webm"]) }}
+
+### Comparison to Related Work
+
+{{ carousel(paths=["/video/thingi10k_comp.webm", "/video/armadillo_comp.webm", "/video/shapenet_comp.webm", "/video/scannet_comp.webm",  "/video/dragon_comp.webm", "/video/dfaust_comp.webm"]) }}
+
+## :page_with_curl: Paper
+
+You can view the paper below or download it via the link at the top.
+
+{{ pdf(path="2026-TVCG-HYVE.pdf") }}
+
+## :scroll: BibTeX
 
 ```bibtex
 @misc{jeskeHYVEHybridVertex2024,

content/_index.md

@@ -5,7 +5,7 @@
   "private": true,
   "scripts": {
     "build": "tailwindcss -i styles/input.css -o static/style.css --minify",
-    "dev": "tailwindcss -i styles/input.css -o static/style.css --watch"
+    "dev": "tailwindcss -i styles/input.css -o static/style.css --watch --minify"
   },
   "devDependencies": {
     "@tailwindcss/cli": "^4.1.18",

package.json

@@ -70,15 +70,15 @@ <h1 class="text-4xl tracking-tight text-gray-900 md:text-6xl mb-6">
         <!-- Teaser -->
         {% if section.extra.teaser_video %}
         <div class="mb-16 rounded-xl overflow-hidden shadow-2xl border border-gray-200">
-            <video class="w-full" autoplay loop muted playsinline>
-                <source src="{{ section.extra.teaser_video }}" type="video/mp4">
+            <video class="w-full" autoplay loop muted playsinline controls>
+                <source src="{{ section.extra.teaser_video }}" type="video/webm">
                 Your browser does not support the video tag.
             </video>
         </div>
         {% endif %}
 
         <!-- Content -->
-        <main class="prose prose-gray mx-auto text-justify">
+        <main class="prose prose-gray max-w-[80%] mx-auto text-justify">
             {{ section.content | safe }}
         </main>
 

static/style.css

@@ -0,0 +1,12 @@
+<div class="carousel relative w-full md:w-[120%] md:-ml-[10%] my-8 not-prose group">
+    <div class="flex overflow-x-auto snap-x snap-mandatory gap-4 pb-4" style="scrollbar-width: thin;">
+    {% for path in paths %}
+        <div class="snap-center shrink-0 w-[85%] sm:w-[70%] md:w-[60%] aspect-video bg-gray-100 rounded-xl overflow-hidden shadow-md border border-gray-200">
+            <video autoplay controls muted loop playsinline class="w-full h-full object-cover">
+                <source src="{{ path }}" type="video/mp4">
+                Your browser does not support the video tag.
+            </video>
+        </div>
+    {% endfor %}
+    </div>
+</div>

templates/index.html

@@ -0,0 +1,8 @@
+<div class="w-full aspect-[8.5/11] md:aspect-[4/3] not-prose my-8">
+    <object data="{{ path }}" type="application/pdf" class="w-full h-full rounded-xl shadow-xl border border-gray-200">
+        <div class="flex flex-col items-center justify-center h-full bg-gray-50 text-gray-500 gap-2">
+            <p>Unable to display PDF file.</p>
+            <a href="{{ path }}" class="text-blue-600 hover:underline font-medium">Download</a> 
+        </div>
+    </object>
+</div>