tonybtw.com

tonybtw.com

https://git.tonybtw.com/tonybtw.com.git git://git.tonybtw.com/tonybtw.com.git
tonybtw.com / layouts / _default / single.html
1,928 bytes raw
1 
<!DOCTYPE html>
2 
<html lang="en">
3 
  <head>
4 
    <meta charset="utf-8" />
5 
    <meta name="viewport" content="width=device-width, initial-scale=1" />
6 
    <meta name="author" content="Tony, btw." />
7 
    <link rel="icon" type="image/png" href="/img/favicon.png" />
8 
    <link rel="stylesheet" href="/css/code.css" />
9 
    <link rel="stylesheet" href="/css/site.css" />
10 
    <title>{{ .Title }}</title>
11 
  </head>
12 
  <body>
13
14 
    {{ partial "header.html" . }}
15
16 
    <main class="container">
17 
      <div class="row" style="display: flex; align-items: flex-start; gap: 2rem;">
18
19 
        <!-- Main Content -->
20 
        <div class="column" style="flex: 1;">
21 
          <article class="site-post">
22 
            <h1 class="site-post-title center">{{ .Title }}</h1>
23 
            {{ with .Params.date }}<p class="site-post-meta center">{{ . }}</p>{{ end }}
24
25 
            {{ with .Params.image }}
26 
              <div class="post-hero">
27 
                <img src="{{ . | relURL }}" alt="{{ $.Title }}" loading="lazy" />
28 
              </div>
29 
            {{ end }}
30
31 
            {{ if .Params.video }}
32 
            <div class="video">
33 
              <iframe src="https://www.youtube.com/embed/{{ .Params.video }}" allowfullscreen></iframe>
34 
            </div>
35 
            {{ end }}
36
37 
            <div id="content" class="mb-10">
38 
              {{ .Content }}
39 
            </div>
40 
          </article>
41 
        </div>
42
43 
        <!-- Sidebar TOC -->
44 
        {{ if gt (len .TableOfContents) 80 }}
45 
        <aside class="content-panel" style="flex: 0 0 250px; max-width: 250px; position: sticky; top: 100px; align-self: flex-start;">
46 
          <div class="pb-3">
47 
            <strong class="text-xl">Table of Contents</strong>
48 
          </div>
49 
          <div id="tableOfContentContainer" style="max-height: calc(100vh - 8rem); overflow-y: auto;">
50 
            {{ .TableOfContents }}
51 
          </div>
52 
        </aside>
53 
        {{ end }}
54
55 
      </div>
56 
    </main>
57 
  </body>
58 
</html>