Blog stuff initial version

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>
+}