HMC
/
hmc_site_source
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update design of media template

seattle2022
Ben Visness 2024-10-27 20:49:18 -05:00
parent 1ac313ddc4
commit 05f1735e19
1 changed files with 60 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

109
layouts/media/single.html
View File

@ -22,59 +22,70 @@
</div> </div>
</div> </div>
{{ range .Params.Videos }} <div class="flex flex-col lg:flex-row gap-5">
<div class="video-container"> <div class="flex-grow flex flex-col gap-5">
<iframe {{ range .Params.Videos }}
src="{{ .embed }}" <div class="video-container">
frameborder="0" <iframe
allow="autoplay; fullscreen; picture-in-picture; clipboard-write" src="{{ .embed }}"
style="width:100%;height:100%;" frameborder="0"
title="{{ .title }}"> allow="autoplay; fullscreen; picture-in-picture; clipboard-write"
</iframe> style="width:100%;height:100%;"
</div> title="{{ .title }}">
{{ end }} </iframe>
<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 gap-8">
<div class="grow">
<div class="font-bold dark:text-white">{{ .name }}</div>
{{ if .bio }}
<div>
{{ .bio | markdownify }}
</div>
{{ end }}
</div> </div>
{{ if .image }} {{ end }}
{{ $imageurl := resources.Get .image }} </div>
{{ if $imageurl}} <div class="flex flex-col gap-5 lg:w-1/3">
<div <div class="dark:text-white">
class="rounded-full aspect-square overflow-hidden shrink-0 w-32 self-start" {{ .Content }}
style="background: url({{ $imageurl.RelPermalink }}) center top no-repeat; background-size: cover;" </div>
title="{{ .name }}"
></div> {{ $hasGoodSpeaker := false }}
{{ range .Params.Speakers }}
{{ if or .bio .image }}
{{ $hasGoodSpeaker = true }}
{{ end }}
{{ end }}
{{ if $hasGoodSpeaker }}
<div>
<h4 class="mb-2">About the speaker{{ if (gt (len .Params.Speakers) 1) }}s{{ end }}</h4>
<div class="flex flex-col gap-3">
{{ range .Params.Speakers }}
<div class="flex gap-8 items-center">
<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 }}
{{ if $imageurl}}
<div
class="rounded-full aspect-square overflow-hidden shrink-0 w-24 self-start"
style="background: url({{ $imageurl.RelPermalink }}) center top no-repeat; background-size: cover;"
title="{{ .name }}"
></div>
{{ end }}
{{ end }}
</div>
{{ end }}
</div>
</div>
{{ end }}
<div class="flex flex-col gap-2">
{{ range .Params.Videos }}
{{ if .download_link }}
<a class="btn btn-outline-primary" href="{{ .download_link }}">Download video: {{ .title }}</a>
{{ end }} {{ end }}
{{ end }} {{ end }}
</div> </div>
{{ end }} </div>
{{ end }} </div>
{{ range .Params.Videos }}
{{ if .download_link }}
<a class="btn btn-outline-primary self-start" href="{{ .download_link }}">Download video: {{ .title }}</a>
{{ end }}
{{ end }}
</div> </div>
</section> </section>
{{ end }} {{ end }}