1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
|
package main
templ HeadComponent(title string, description string) {
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta name="color-scheme" content="dark"/>
<link rel="icon" type="image/svg+xml" href="/favicon.svg"/>
<meta name="darkreader-lock"/>
<meta name="robots" content="index, follow, noarchive"/>
<meta name="keywords" content="Kyren223, Krypton, Compiler, Minecraft, Developer, Language, Langdev, Gamedev, Game, Software, Software Engineer, Game developer"/>
<meta name="author" content="Kyren223"/>
<meta name="description" content={ description }/>
<title>{ title }</title>
<meta property="og:title" content={ title }/>
<meta property="og:description" content={ description }/>
<meta property="og:type" content="website"/>
<meta property="og:url" content="https://kyren.codes/"/>
<meta property="og:image" content="https://kyren.codes/image.png"/>
<meta property="og:image:alt" content="a cyan sphere with a dark background"/>
<meta property="og:site_name" content="Kyren's Website"/>
<script src="/public/theme.js" defer></script>
<link rel="stylesheet" href="/public/style.css"/>
{ children... }
</head>
}
templ NavLink(href string, label string) {
<a href={ templ.SafeURL(href) } class="text-(--primary) hover:text-(--accent)">{ label }</a>
}
templ NavComponent(path string) {
<nav class="flex justify-between gap-10 p-4 mb-[1.5625rem] border-2 border-(--alt) text-[1.375rem]">
<span>{ path }</span>
<span class="flex gap-[1ch]">
@NavLink("/", "home")
for _, dir := range []string{"skills", "projects", "blogs"} {
@NavLink("/"+dir, dir)
}
@NavLink("/shell", "shell")
</span>
</nav>
}
templ TerminalLayout(style Style, path string) {
<!DOCTYPE html>
<html lang="en" style={ styleToCss(style) }>
@HeadComponent(path, "My personal website") {
<link rel="stylesheet" href="/public/styles/terminal.css"/>
}
<body>
<main class="w-[75rem] h-[40rem] p-8 border-[0.2rem] border-(--text) overflow-hidden text-[1.125rem]">
@NavComponent(path)
{ children... }
</main>
</body>
</html>
}
templ HomePage(style Style) {
@TerminalLayout(style, "/home/kyren/") {
<div id="content" class="w-0 h-0 invisible sm:w-full sm:h-full sm:visible">
<h1>Home</h1>
<p>Go server running with Templ templates and Air hot-reloading.</p>
</div>
}
}
templ SkillsPage(style Style) {
@TerminalLayout(style, "/home/kyren/skills.md") {
<h1 class="text-3xl font-bold">About</h1>
<p>Single-binary web app using Go's standard library net/http.</p>
}
}
templ ProjectsPage(style Style, projects []Project) {
@TerminalLayout(style, "/home/kyren/projects") {
<h1>Items</h1>
<div class="card">
<ul>
<li>
<span>foo</span>
<span class="badge-active">[ACTIVE]</span>
</li>
</ul>
</div>
}
}
|
