package main templ HeadComponent(title string, description string) { { title } { children... } } templ BlogItem(header string, blog Blog, extra string) { @TerminalBorder(header, blog.Date.Format("January 2, 2006"), extra) {

{ blog.Title }

{ blog.Desc }

 } } templ Link(href string, newTab bool) { { children... } } templ TerminalStack(joined bool, extra string) {
*+*]:mt-[-0.1rem]", joined), templ.KV("gap-4", !joined), extra }> { children... }
} templ TerminalBorder(header string, footer string, extra string) {
{ header } { footer } { children... }
} templ CopyIcon() { } templ TerminalBorderWithCopy(header string, footer string, extra string, text string, href string, showLabel bool) { @TerminalBorder(header, footer, extra) {
if href != "" { { children... } } else { { children... } } if showLabel { }
} } templ CopyPre(text string, preClass string) { } templ NavLink(href string, label string) { { label } } templ Nav(path string) { } templ TerminalLayout(style Style, path string) { @HeadComponent(path, "My personal website") { }
@Nav(path) { children... }
} const fingerprint = `+--[ED25519 256]--+ | +. .. +.B| | + o..o . BB| | ..o oo.o =+E| | ... oo. + o.| | . S . = | | . . + o | | o o o . | | oo .o+ + | | ++ooo+= | +----[SHA256]-----+` const sshKey = "ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIO7P9K9D5RkBk+JCRRS6AtHuTAc6cRpXfRfRMg/Kyren" templ HomePage(style Style, latestBlog *Blog) { @TerminalLayout(style, "/home/kyren/") {
@TerminalStack(true, "") { @TerminalBorder("Profile", "", "[--border-py:0.875rem]") {
picture @CopyPre(sshKey, "shrink-0 text-[0.675rem] leading-[normal]") { { fingerprint } }
} @TerminalBorderWithCopy("Email", "", "", "contact@kyren.codes", "mailto:contact@kyren.codes", false) { contact@kyren.codes } @TerminalBorder("Git Repos (main)", "", "") { @Link("https://git.kyren.codes", true) { git.kyren.codes } } @TerminalBorder("GitHub (secondary)", "", "") { @Link("https://github.com/kyren223", true) { github.com/Kyren223 } } @TerminalBorder("Discord", "", "") { @Link("https://discord.com/users/481884415090229258", true) { Kyren223 } } }
@TerminalBorder("Status", "", "") {
Working on @Link("/projects/krypton", false) { Krypton } | Learning Langdev & Compiler Design | Available for hire
} @TerminalBorder("About Me", "", "") { Hi! I'm Kyren, a softwarea engineer and game developer. I love working with low level languages and learning things deeply. I am also a terminal nerd and Linux enthusiast who uses NVIM btw. And when I am not coding, I am most likely playing video games, watching Anime, or solving Rubik's cubes fast. } @BlogItem("Latest Blog Post", *latestBlog, "")
@TerminalBorderWithCopy("SSH Key", "", footerClass(false), sshKey, "", true) { { sshKey } }
} } func footerClass(connected bool) string { style := "col-span-2 select-text [--border-py:0.5rem]" if connected { style += " mb-[0.30rem]" } return style } templ SkillsPage(style Style) { @TerminalLayout(style, "/home/kyren/skills.md") { @TerminalStack(false, "") { @TerminalBorder("Setup", "", "") { $ fastfetch @Fastfetch(fetchRows) } } } } templ ProjectsPage(style Style, projects []Project) { @TerminalLayout(style, "/home/kyren/projects") {

Items

} } templ NotFoundPage(style Style, path string) { @TerminalLayout(style, "404") { @TerminalStack(true, "") { @TerminalBorder("Shell", "", "") {

$ cd ~{ path }

"{ path[1:] }": No such file or directory (os error 2)

} @TerminalBorder("", "", "") {
{ ">" } @Link("/", false) { { "cd $HOME" } }
} } } } templ ScrollBox(extra string) {
{ children... }
} templ BlogsPage(style Style, blogs []Blog) { @TerminalLayout(style, "blogs") { @TerminalBorder("Shell", "", "mb-[1rem]") { $ ls -lh ~/blogs } @ScrollBox("") { @TerminalStack(false, "mt-[0.5rem]") { for i := 0; i < 1; i++ { for _, blog := range blogs { @BlogItem("", blog, "mb-[1rem]") } } } } } } type FetchRow struct { Icon templ.Component Color string // tailwind text color class, used for the icon and label Label string Value string } templ IconMonitor(color string) { @Icon(color) { } } templ IconTerminal(color string) { @Icon(color) { } } templ IconCode(color string) { @Icon(color) { } } templ IconCpu(color string) { @Icon(color) { } } templ IconScriptLang(color string) { @Icon(color) { } } templ IconEditor(color string) { @Icon(color) { } } templ IconDebugger(color string) { @Icon(color) { } } templ IconKeyboard(color string) { @Icon(color) { } } templ IconUptime(color string) { @Icon(color) { } } func row(icon func(color string) templ.Component, color, label, value string) FetchRow { return FetchRow{Icon: icon(color), Color: color, Label: label, Value: value} } var fetchRows = []FetchRow{ // row(IconTerminal, "text-(--secondary)", "Terminal", "Ghostty & Zsh"), row(IconCode, "text-(--accent)", "Main Language", "C"), row(IconScriptLang, "text-(--accent)", "Scripting Langs", "Go and Python"), row(IconDebugger, "text-[#F16265]", "Debugger", "Raddebugger"), row(IconMonitor, "text-[#54D7A9]", "Operating System", "Fedora KDE Linux"), row(IconEditor, "text-[#54D7A9]", "Text Editor", "Neovim"), row(IconUptime, "text-[#D8C44B]", "Uptime", GetMyUptime()), // row(IconCpu, "text-(--extra)", "Hardware", "..."), } func branch(i, n int) string { switch { case n == 1: return "─" case i == 0: return "┌" case i == n-1: return "└" default: return "├" } } templ Fastfetch(rows []FetchRow) {
for i, row := range rows { { branch(i, len(rows)) } @row.Icon { row.Label } { row.Value } }
} templ Icon(color string) { }