tonybtw.com

tonybtw.com

https://git.tonybtw.com/tonybtw.com.git git://git.tonybtw.com/tonybtw.com.git
tonybtw.com / layouts / community / single.html
2,920 bytes raw
1 
<!DOCTYPE html>
2 
<html lang="en">
3 
  <head>
4 
    <meta charset="utf-8" />
5 
    <meta
6 
      name="viewport"
7 
      content="width=device-width, initial-scale=1"
8 
    />
9 
    <meta
10 
      name="author"
11 
      content="{{ with .Params.author }}{{ . }}{{ else }}Tony, btw.{{ end }}"
12 
    />
13 
    <link rel="icon" type="image/png" href="/img/favicon.png" />
14 
    <!-- <link rel="stylesheet" href="/css/code.css" /> -->
15 
    <link rel="stylesheet" href="/css/site.css" />
16 
    <title>{{ .Title }}</title>
17 
  </head>
18 
  <body>
19
20 
    {{ partial "header.html" . }}
21
22 
    <main class="container">
23 
      <style>
24 
        p img {
25 
          display: block;
26 
          max-width: 80rem;
27 
          width: 100%;
28 
          height: auto;
29 
          margin: 1rem auto;
30 
          border-radius: 8px;
31 
        }
32 
      </style>
33 
      <div class="row" style="display: flex; align-items: flex-start; gap: 2rem;">
34
35 
        <!-- Main Content -->
36 
        <div class="column" style="flex: 1;">
37 
          <article class="site-post">
38 
            <h1 class="site-post-title center">{{ .Title }}</h1>
39
40 
            <p class="site-post-meta center">
41 
              {{ with .Params.author }}By {{ . }} ยท {{ end }}
42 
              {{ (.Date).Format "01/02/2006" }}
43 
            </p>
44
45 
            {{/* Pick screenshot/hero image from multiple possible params:
46 
                 1) .Params.images[0]
47 
                 2) .Params.image
48 
                 3) .Params.screenshot
49 
            */}}
50 
            {{ $img := "" }}
51 
            {{ with .Params.images }}{{ if gt (len .) 0 }}{{ $img = index . 0 }}{{ end }}{{ end }}
52 
            {{ if and (eq $img "") .Params.image }}{{ $img = .Params.image }}{{ end }}
53 
            {{ if and (eq $img "") .Params.screenshot }}{{ $img = .Params.screenshot }}{{ end }}
54
55 
            {{ with $img }}
56 
              <div class="post-hero">
57 
                <img src="{{ . | relURL }}" alt="{{ $.Title }}" loading="lazy" />
58 
              </div>
59 
            {{ end }}
60
61 
            {{ if .Params.video }}
62 
              <div class="video">
63 
                <iframe
64 
                  src="https://www.youtube.com/embed/{{ .Params.video }}"
65 
                  allowfullscreen
66 
                ></iframe>
67 
              </div>
68 
            {{ end }}
69
70 
            <div id="content" class="mb-10">
71 
              {{ .Content }}
72 
            </div>
73 
          </article>
74 
        </div>
75
76 
        <!-- Sidebar TOC -->
77 
        {{ if gt (len .TableOfContents) 80 }}
78 
          <aside class="content-panel"
79 
                 style="flex: 0 0 250px; max-width: 250px; position: sticky; top: 100px; align-self: flex-start;">
80 
            <div class="pb-3">
81 
              <strong class="text-xl">Table of Contents</strong>
82 
            </div>
83 
            <div id="tableOfContentContainer" style="max-height: calc(100vh - 8rem); overflow-y: auto;">
84 
              {{ .TableOfContents }}
85 
            </div>
86 
          </aside>
87 
        {{ end }}
88
89 
      </div>
90 
    </main>
91 
  </body>
92 
</html>