Some media pages

layouts/media/single.html

@@ -0,0 +1,75 @@
+{{ define "main" }}
+  <section class="mb-8">
+    <div class="container flex flex-col gap-5">
+      <div>
+        <h2>{{ .Params.Title }}</h2>
+        <div>
+          {{ if eq .Params.Mediatype "talk" }}
+              Presented by
+          {{ else if eq .Params.Mediatype "demo" }}
+              Presented by
+          {{ else if eq .Params.Mediatype "chat" }}
+              Fireside chat with
+          {{ end }}
+          {{ range .Params.Speakers }}
+              <a href="">{{ .name }}</a>
+          {{ end }}
+          at
+          <a href="">{{ .Params.Conference }}</a>
+        </div>
+      </div>
+
+      {{ range .Params.Videos }}
+        <div class="video-container">
+          <iframe
+            src="{{ .embed }}"
+            frameborder="0"
+            allow="autoplay; fullscreen; picture-in-picture; clipboard-write"
+            style="width:100%;height:100%;"
+            title="{{ .title }}">
+          </iframe>
+        </div>
+      {{ end }}
+
+      <div class="dark:text-white">
+        {{ .Content }}
+      </div>
+
+      {{ $hasGoodSpeaker := false }}
+      {{ range .Params.Speakers }}
+        {{ if or .bio .image }}
+          {{ $hasGoodSpeaker = true }}
+        {{ end }}
+      {{ end }}
+      {{ if $hasGoodSpeaker }}
+        <h4>About the speaker{{ if (gt (len .Params.Speakers) 1) }}s{{ end }}</h4>
+        {{ range .Params.Speakers }}
+          <div class="flex">
+            <div class="grow">
+              <div class="font-bold dark:text-white">{{ .name }}</div>
+              {{ if .bio }}
+                <div>
+                  {{ .bio | markdownify }}
+                </div>
+              {{ end }}
+            </div>
+            {{ if .image }}
+              {{ $imageurl := resources.Get .image }}
+              <div
+                class="rounded-full aspect-square overflow-hidden shrink-0 w-32"
+                style="background: url({{ $imageurl.RelPermalink }}) center top no-repeat; background-size: cover;"
+                title="{{ .name }}"
+              ></div>
+            {{ end }}
+          </div>
+        {{ end }}
+      {{ end }}
+
+      {{ range .Params.Videos }}
+        {{ if .download_link }}
+          <a class="btn btn-outline-primary self-start" href="{{ .download_link }}">Download {{ .title }}</a>
+        {{ end }}
+      {{ end }}
+    </div>
+  </section>
+{{ end }}