diff options
Diffstat (limited to 'website.templ')
| -rw-r--r-- | website.templ | 32 |
1 files changed, 32 insertions, 0 deletions
diff --git a/website.templ b/website.templ index 1371351..454568c 100644 --- a/website.templ +++ b/website.templ @@ -23,6 +23,7 @@ templ HeadComponent(title string, description string) { <script src="/public/theme.js" defer></script> <script src="/public/scrollbar.js" defer></script> <script src="/public/my_uptime.js" defer></script> + <script src="/public/footnotes.js" defer></script> <link rel="stylesheet" href="/public/style.css"/> { children... } </head> @@ -750,3 +751,34 @@ templ Icon(color string) { { children... } </svg> } + +templ BlogPage(style Style, blog Blog, prev *Blog, next *Blog) { + @TerminalLayout(style, blog.Title) { + @ScrollBox("") { + @BlogItem("", blog, "mb-[1rem]") + <article class="prose select-text font-(family-name:--font-normal) text-[18px] leading-[1.7]"> + @templ.Raw(blog.HTML) + </article> + <div class="grid grid-cols-2 gap-x-[1rem] mt-[1rem]"> + @BlogNav("Previous Blog", prev, "") + @BlogNav("Next Blog", next, "") + </div> + } + } +} + +templ BlogNav(label string, blog *Blog, extra string) { + @TerminalBorder(label, "", extra) { + if blog != nil { + <a href={ templ.SafeURL("/blogs/" + blog.Slug) }>vim ~/blogs/{ blog.Slug }</a> + } + } +} + +templ FootnotePanel() { + <aside data-footnote-panel class="hidden fixed left-[calc(50%+38.5rem)] top-[calc(50%-20rem)] w-[10.5rem] max-h-[40rem] overflow-y-auto"> + @TerminalBorder("note", "", "text-[14px]") { + <div data-footnote-body class="font-(family-name:--font-normal)"></div> + } + </aside> +} |