-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
64 lines (64 loc) · 3.55 KB
/
index.html
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
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<link rel="icon" type="image/x-icon" href="/favicon.ico"/>
<link rel="alternate" href="/posts/feed">
<link rel="stylesheet" type="text/css" href="/styles.css"/>
<link rel="stylesheet" type="text/css" href="/highlight.css"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>ThoughtBank Blog</title>
</head>
<body>
<nav class="navbar bg-base-100 text-base-content">
<div class="flex-1">
<a href="/" class="btn btn-ghost text-xl">ThoughtBank Blog</a>
</div>
<div class="flex-none">
<input type="text" name="q" placeholder="Search" aria-label="search"
hx-get="/posts/search"
hx-target="#posts"
hx-push-url="true"
hx-trigger="keyup changed delay:500ms"
class="input input-bordered w-full max-w-xs bg-neutral text-neutral-content"/>
</div>
</nav>
<div class="md:container md:mx-auto">
<div class="md:grid md:grid-cols-4 md:gap-4">
<main id="posts" class="md:col-span-3 mx-auto" hx-get="/posts/" hx-trigger="load">
<span class="htmx-indicator loading loading-dots loading-md"></span>
</main>
<div class="md:col-span-1">
<div class="bg-neutral rounded-md p-4 prose mb-4">
<h3>About</h3>
<p>
This tech blog employs HTMX and Haskell to create a dynamic platform that showcases
Markdown-formatted content stored within MongoDB documents.
</p>
</div>
<div class="prose">
<div hx-get="/posts/summary" hx-trigger="load" hx-swap="outerHTML"></div>
<h2>Socials</h2>
<ul>
<li><a href="https://github.com/zachary822" rel="noopener noreferrer" target="_blank"
class="no-underline">
<svg class="w-6 h-6 fill-current inline" focusable="false" viewBox="0 0 24 24">
<path d="M12 1.27a11 11 0 00-3.48 21.46c.55.09.73-.28.73-.55v-1.84c-3.03.64-3.67-1.46-3.67-1.46-.55-1.29-1.28-1.65-1.28-1.65-.92-.65.1-.65.1-.65 1.1 0 1.73 1.1 1.73 1.1.92 1.65 2.57 1.2 3.21.92a2 2 0 01.64-1.47c-2.47-.27-5.04-1.19-5.04-5.5 0-1.1.46-2.1 1.2-2.84a3.76 3.76 0 010-2.93s.91-.28 3.11 1.1c1.8-.49 3.7-.49 5.5 0 2.1-1.38 3.02-1.1 3.02-1.1a3.76 3.76 0 010 2.93c.83.74 1.2 1.74 1.2 2.94 0 4.21-2.57 5.13-5.04 5.4.45.37.82.92.82 2.02v3.03c0 .27.1.64.73.55A11 11 0 0012 1.27"></path>
</svg>
<span class="underline">GitHub</span>
</a></li>
<li><a href="https://www.linkedin.com/in/zachary-juang/" rel="noopener noreferrer" target="_blank"
class="no-underline">
<svg class="w-6 h-6 fill-current inline" focusable="false" viewBox="0 0 24 24">
<path d="M19 3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h14m-.5 15.5v-5.3a3.26 3.26 0 0 0-3.26-3.26c-.85 0-1.84.52-2.32 1.3v-1.11h-2.79v8.37h2.79v-4.93c0-.77.62-1.4 1.39-1.4a1.4 1.4 0 0 1 1.4 1.4v4.93h2.79M6.88 8.56a1.68 1.68 0 0 0 1.68-1.68c0-.93-.75-1.69-1.68-1.69a1.69 1.69 0 0 0-1.69 1.69c0 .93.76 1.68 1.69 1.68m1.39 9.94v-8.37H5.5v8.37h2.77z"></path>
</svg>
<span class="underline">LinkedIn</span>
</a></li>
</ul>
</div>
</div>
</div>
</div>
<script type="module" src="/main.js"></script>
</body>
</html>